0
Ich bin neu zu reagieren und JS und ich haben eine App, die <input type="text"> liest und Leute kommentieren lassen. Ich möchte diesen Kommentar in einer Datei speichern und die Daten abrufen, wenn ich den gleichen Namen erneut suche.Dateihandhabung in ReactJS
z. Ich gebe für "Fisch" ein. App3 wird rendern und zeigt, wo Sie kommentieren müssen, wenn ich meinen Kommentar einlege, wird irgendwo eine neue Datei erstellt (zB fish.txt). Und wenn ich das Wort noch einmal besuche, kann ich meine letzten Kommentare lesen.
Dies ist mein Code so weit
class App3 extends Component {
constructor(props) {
super(props);
this.handleChange = this.handleChange.bind(this);
this.handleSubmit = this.handleSubmit.bind(this);
this.state = {items: [], text: ''};
}
render() {
return (
<div className="app3">
<h1>Comments</h1>
<div className="commentsSection">
<AddComment items={this.state.items} />
</div>
<form onSubmit={this.handleSubmit}>
<textarea onChange={this.handleChange} value={this.state.text} />
<button>Comment</button>
</form>
</div>
);
}
handleChange(e) {
this.setState({text: e.target.value});
}
handleSubmit(e) {
e.preventDefault();
var newItem = {
text: this.state.text,
id: Date.now()
};
this.setState((prevState) => ({
items: prevState.items.concat(newItem),
text: ''
}));
}
}
class AddComment extends React.Component {
render() {
return (
<ul>
{this.props.items.map(item => (
<p key={item.id}>{item.text}</p>
))}
</ul>
);
}
}Vielen Dank im Voraus :)
Wenn Sie einige Daten auf dem Client beibehalten möchten, können Sie den lokalen Speicher berücksichtigen. Wenn Sie dauerhafte Persistenz benötigen, müssen Sie Daten an den Server senden und dort speichern. – Areca