Używam React JS do renderowania zawartości HTML. Problem polega na tym, że nie jestem w stanie zrozumieć konkretnej sekcji kodu, co ona robi.React JS: Objaśnienie funkcji this.props.items.map
Jeśli widzisz podstawową próbkę listęzadańz z linku poniżej http://facebook.github.io/react/
<script type='text/jsx'>
/** @jsx React.DOM */
var TodoList = React.createClass({
render: function(){
var createItem = function(itemText) {
return <li>{itemText}</li>;
};
return <ul>{this.props.items.map(createItem)}</ul>;
}
});
var TodoApp = React.createClass({
getInitialState: function(){
return {items:[], text: ''}
},
onChange: function(e)
{
this.setState({text: e.target.value});
},
handleSubmit: function(e)
{
e.preventDefault();
var nextItems = this.state.items.concat([this.state.text]);
var nextText = ''
this.setState({items: nextItems, text: nextText});
},
render:function(){
return (
<div>
<h3>ToDo List</h3>
<TodoList items={this.state.items}/>
<form onSubmit={this.handleSubmit}>
<input type="text" onChange={this.onChange} value={this.state.text}/>
<button>Add #{this.state.items.length+1}</button>
</form>
</div>
)
}
});
React.render(<TodoApp />, document.getElementById('toDoListApp'));
</script>
Jestem w zasadzie nie jest w stanie zrozumieć, co mapa robi i jak tworzyć parametry poz pracują. Może ktoś podać szczegóły na ten sam:
var TodoList = React.createClass({
render: function(){
var createItem = function(itemText) {
return <li>{itemText}</li>;
};
return <ul>{this.props.items.map(createItem)}</ul>;
}
});
Dzięki Ankit
Dzięki, lubiłem tę funkcję mapy bardzo dużo.Widziałem twoją odpowiedź i spojrzałem na jej dokumentację javascript. –