Я читаю React в течение нескольких дней. Я могу понять большую часть того, что я смотрю, но я не совсем уверен в своей способности писать. Я работал над небольшим веб-приложением, которое делает все его генерации html через jQuery и добавляя элементы друг к другу. Я хотел бы попытаться восстановить его с помощью React, потому что считаю, что это будет быстрее. Этот JSFiddle является небольшим примером того, над чем я работаю. Как вы могли бы написать его с помощью React?
JS:
function remove() {
this.remove();
}
function timed_append_new_element() {
setTimeout(function () {
var added_content = $("<span />", {
class: "added_content",
text: "Click to close",
click: remove
});
container.append(added_content);
}, 3000);
}
function append_new_element() {
var added_content = $("<span />", {
class: "timed_added_content",
text: "Click to close",
click: remove
});
container.append(added_content);
}
var container = $("<div />", {
class: "container"
});
var header = $("<span />", {
class: "header",
text: "jQuery to React.js Header"
});
var add_button = $("<button />", {
class: "add_button",
text: "Add Element",
click: append_new_element
});
var timed_add_button = $("<button />", {
class: "add_button",
text: "Add Element in 3 seconds",
click: timed_append_new_element
});
container.append(header);
container.append(add_button);
container.append(timed_add_button);
$("body").append(container);