import React, { Component } from 'react';
import './App.css';
class App extends Component {
constructor(props) {
super(props);
this.state = {
items: []
}
}
addItem(e) {
var itemArray = this.state.items;
itemArray.push({
text: this._inputElement.value,
key: Date.now()
});
this.setState({
items: itemArray
});
e.preventDefault();
}
render() {
return (
<div className="main">
<div className="header">
<form onSubmit={this.addItem}>
<input ref={(a) => this._inputElement = a}
placeholder="enter your message"/>
<button type="submit">add</button>
</form>
</div>
<todoItems entries={this.state.items}></todoItems>
</div>
);
}
}
class todoItems extends Component {
todoEntries = this.props.entries;
createTasks(item) {
return <li key={item.key}>{item.text}</li>
}
listItems = this.todoEntries.map(this.createTasks);
render() {
return(
<ul className="theList">
{this.listItems}
</ul>
);
}
}
export default App;
我尝试在 react.js 中制作“todo”应用程序，但它不起作用添加消息。它发生刷新和错误控制台消息：bundle.js:30031 警告：entries标签上的未知道具。从元素中移除这个道具。
我该如何解决？
React 组件必须以大写字母开头，否则将无法识别。应该
<TodoItems.../>
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句