Skip to content

Instantly share code, notes, and snippets.

@luillyfe
Last active November 7, 2018 11:16
Show Gist options
  • Save luillyfe/993fdc0df3b978c533b4ad1c68643733 to your computer and use it in GitHub Desktop.
Save luillyfe/993fdc0df3b978c533b4ad1c68643733 to your computer and use it in GitHub Desktop.
React updating props.
const News = props => {
const changeTitle = () => {
props.changeTitle("Title changed!");
};
return (
<div>
<h1>{props.title}</h1>
<div>{props.content}</div>
<button onClick={changeTitle}>Mutate!</button>
</div>
);
};
class App extends Component {
state = {
title: "News title",
content: "A description should be here!"
}
changeTitle = () => {
this.setState({ title: "Title changed!" });
}
printState = () => {
const { title, content } = this.state;
console.log(`News title: ${title}, News content: ${content}`);
}
render() {
const { title, content } = this.state;
return (
<div>
<News title={title} content={content} changeTitle={this.changeTitle} />
<button onClick={this.printState}>Print parent state</button>
</div>
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment