import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import './index.css';
var TodoList = React.createClass({
getInitialState: function() {
return {items: []};
},handleAdd: function() {
var newItem = this.refs.newItem.value;
if (newItem.length == 0) {
return;
}
this.refs.newItem.value = "";
this.refs.newItem.focus();
this.setState({items: this.state.items.concat(newItem)});
},render: function() {
return (
<div>
<h2>Todo List</h2>
<ul>
{
this.state.items.map(function(item) {
return <li>{item}</li>
})
}
</ul>
<input type="text" ref="newItem" />
<input type="button"
value={'Add #' + (this.state.items.length + 1)}
onClick={this.handleAdd}>
</input>
</div>
)
},});
var TodoApp = React.createClass({
render: function() {
return (
<TodoList />
);
}
})
ReactDOM.render(
<TodoApp />,document.getElementById('root')
);
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。