Код родителя:
class App extends React.Component {
constructor(props) {
super(props);
this.state = {
tasks: [{
active: true,
content: "Eat chicken",
comments: ["comment1", "comment2"]
}
]
};
}
needData(data){
console.log("data",data)
}
onAddItem(content){
this.setState({
tasks: this.state.tasks.concat.push(content: content, comments: [], active: true)
});
}
render(){
return(
<div className="container-fluid" >
<div className="row app-row">
<LogoBar />
<TasksList tasks = {this.state.tasks} addItem={this.onAddItem.bind(this)} needData={()=>this.needData}/>
</div>
</div>
)
}
}
Код ребенка:
class TasksList extends React.Component {
addItem(event){
event.preventDefault();
console.log(event.refs.itemInput.value);
let input = event.refs.itemInput.value;
this.props.onAddItem(input);
this.props.needData(input)
}
render(){
return(
<div className="col-sm-5 col-xs-12">
<h2> Items </h2>
<form className="form-inline" onSubmit={this.addItem.bind(this)}>
<input type="text" ref="itemInput" placeholder="Type name here..." className="form-control" />
<input type="submit" ref='itemSubmit' value="Add new" className="btn btn-info" />
</form >
</div>
render() {
let onNoteDelete = this.props.onNoteDelete;
return(
<div className="notes-grid" ref="grid">
{this.props.notes.map(note => {
return (
<Note
key={note.id}
color={note.color}
onDelete={()=>onNoteDelete.bind(null, note)}> // и эта строка
{note.text}
</Note>);
})
}
</div>
)
}
constructor(props){
super(props)
this.onNoteDelete=this.onNoteDelete.bind(this)
}
export const renderNotes = async(user , users) => async dispatch => {
let elements = await fire.database().ref('users/' + element + '/notes/'); // Вынес сюда присвоение
Object.keys(users).map(element => {
if (user === users[element].login) {
return dispatch({
type: RENDER_NOTES,
payload: elements
})
}
})
};
submitBalance() {
if (this.props!==undefined && this.props.user!==undefined){
let users = this.props.users; // РУГАЕТСЯ ОН НА ЭТУ СТРОЧКУ
}
let login = this.state.user;
let value = this.state.value;
if (users !== undefined) {
Object.keys(users).map(element => {
if (login === users[element].login) {
this.props.addBalance(element, value)
}
})
}
}
render() {
console.log('---', this.props.users); // ТУТ СНАЧАЛА ВЫВОДИТ ПУСТОЙ ОБЪЕКТ, НО ПО ВЫПОЛНЕНИЮ ЗАПРОСУ ВОЗВРАЩАЕТ ЗНАЧЕНИЕ
return (
<div>
<h1>Here you may add some money</h1>
<span>{this.state.cash}</span>
<Slider onChange={this.handleChange}/>
<RaisedButton label="Primary" primary={true} onClick={()=>this.submitBalance()}/>
</div>
);
render() {
console.log(this.props);
let result = this.props.mark[0]
return (
<div>
<p>{result}</p>
</div>
)
}
render() {
console.log(this.props);
let result = this.props.mark[0]
return (
<div>
{this.props.mark!==undefined && this.props.mark.length!==0
?
this.props.mark.map(
(el,ind)=><p>{el}</p>
)
:null
}
</div>
)
}