http://jsbin.com/zehoceloka/1/edit
my input number is dynamic, it depends on the API how many data it has. So firstly I map it to the view. But there is also a feature where user can add new item. I trying to push a new empty array, but nothing happens. Am I doing it wrong?
class HelloWorldComponent extends React.Component {
constructor(){
super()
this.addNewRow = this.addNewRow.bind(this);
this.state = {
"rules":[
"age must be above 10",
"must wear shoe"
]
}
}
addNewRow(e){
const updated = this.state.rules.push("");
this.setState({rules:updated});
}
render() {
return (
<div>
{this.state.rules.map(obj =>
<input type="text" defaultValue={obj} />
)}
<button>Add New Rules</button>
<br /><br />
<pre>{JSON.stringify(this.state.rules,null,2)}</pre>
</div>
);
}
}