<div className="post-item__buttons buttons-block">
<button
className="buttons-block__change"
onClick={this.props.onClickmodify}
data-id={this.props.dataID}
>
..
</button>
<button
className="buttons-block__delete"
onClick={this.props.onClickdelete}
data-id={this.props.dataID}
>
x
</button>
</div>;
...
modifyItem(e) {
let target = e.target;
let targetID = target.getAttribute('data-id');
console.log(targetID, 'target id');
this.props.modifyItemCallback(targetID);
}
deleteItem(e) {
let target = e.target;
let targetID = target.getAttribute('data-id');
fetch(`https://my-json-server.typicode.com/sergemin/render-list/posts/${targetID}`, {
method: 'DELETE'
})
.then(() => {
console.log(targetID);
this.props.deleteItemCallback(targetID)
})
.catch(error => console.log(error));
}
...
<Post
key={item.id}
dataID={item.id}
title={item.title}
content={item.body}
modifyItemCallback={(id) => console.log(id)}
deleteItemCallback={(id) => console.log(id)}
/>;
server.post("/uploads", (req, res) => {
new formidable.IncomingForm()
.parse(req)
.on("file", function(name, file) {
console.log("Got file:", name);
})
.on("field", function(name, field) {
console.log("Got a field:", name);
})
.on("error", function(err) {
next(err);
})
.on("end", function() {
res.end();
});
});
fetch("https://jsonplaceholder.typicode.com/albums")
.then(response => {
console.log(response.headers.get("Content-Type")); // application/json; charset=utf-8
console.log(response.status); // 200
return response.json();
})
.then(res => {
console.log(res); // iliakan
})
.catch(console.log);
кстати очень хороший вопрос
используйте zeit/now с zeit/next.js
наверно слышали или пробовали
class App extends React.Component {
state = { arr: ["hello", "world", "wow", "react"] };
render() {
return (
<section>
{this.state.arr.map(v => (
<div className="row">
<div>element</div>
<div>element</div>
<div>element</div>
</div>
))}
</section>
);
}
}
ReactDOM.render(<App />, document.body);
deleteItem(event) {
const conf = confirm(`Are you sure?`);
let number = parseFloat(event.target.parentNode.getAttribute("data-key"));
let newTodos = this.state.todos;
if (conf) {
newTodos = newTodos.splice(newTodos.indexOf(number), 1);
this.setState({ todos: newTodos });
} else {
alert(`ok we won't delete it `);
}
}
а почему бы не падать index прямо из.map()
.было бы намного правильнее чем искать в атрибутах
React не рекомендуем вам хранить данные в DOM атрибутов. Даже если у вас есть, атрибуты данных, вероятно, являются более оптимальным подходом, но в большинстве случаев данные должны храниться в состояние компонента реагировать или внешние хранилища.
var fs = require("fs"),
request = require("request");
const download = (uri, filename, callback) => {
request.head(uri, (err, res, body) => {
request(uri)
.pipe(fs.createWriteStream(filename))
.on("close", callback);
});
};
download(
"http://fs.moviestape.net/video/1c4ed0ac8b7d5b4de6c5d58e2ea31a63/serials/Narcos/s01/Narcos.S01E01.mp4",
"./downloads/filename.mp4",
() => {
console.log("done");
}
);
item
.then((response) => {
item = response;
success = true;
})
async createItem() {
this.isLoading = true;
try {
let res = await this.$fetch(`/api/items/${this.params.id}/new/`, {
method: "POST",
body: JSON.stringify(this.createItemBody)
});
let json = await res.json();
await this.dispatch("fetchSecondItem", id);
this.items.push(json);
this.dispatch("notification", {
type: "success",
message: "Item was created."
});
this.isLoading = true;
this.resetForm();
} catch (err) {
this.isLoading = false;
console.log(err);
}
}