class Li extends React.Component {
render() {
return (
<li>{this.props.text}</li>
)
}
}
class Elem extends React.Component {
render() {
return (<div className="element">
<ul>
<Li text={this.props.text}/>
</ul>
</div>)
}
}
class App extends React.Component {
constructor(props) {
super(props);
this.state = {text: 'hello world'};
}
render() {
return (
<div className="pageWrapper">
<h1>To Do List</h1>
<input placeholder="Введите текст" onChange={this.submitText} type="text" className="inp"/>
<Elem text={this.state.text}/>
</div>
)
}
submitText() {
let inpValue = document.querySelector(".inp").value;
this.setState({
text: inpValue
});
}
}
ReactDOM.render(<App />, document.querySelector("#app"));
submitText = (e) => {
this.setState({
text: e.target.value,
});
}
document.body.classList.add('someClass');
constructor(props) {
super(props);
this.state = {text: 'hello world'};
this.handleChange = this.handleChange.bind(this);
}class App extends React.Component {
// ...
hanldeCHange = e => {
this.setState({
text: e.target.value,
});
// ...
}<input onChange={this.handleChange} />class App extends React.Component {
// ...
hanldeCHange = e => {
this.setState({
text: e.target.value,
});
// ...
}
Средний