@mashincode

Отлов изменения дочернего компонента?

У меня есть родителький компонент
class Parent extends React.Component {

    constructor(props) {
        super(props)
        this.testInputValue = ''
    }

    log_test_input_value = () => {
        console.log(this.testInputValue);
    }

    render() {
        return (
             <div>
              <button onClick={log_test_input_value}>Test log</button>
              <Child/>
            </div>
        )
    }
}


и дочерний компонент

class Child extends React.Component {

    constructor() {
        super();
        this.testInputValue = "" ; //пусть инпут изначально пустой
    }

    handleChange(event) {
        this.testInput = event.target.value
    }

    render() {
          <input onChange={this.handleChange(e)} placeholder="test" /> 
        }
    }
}


Они находяться в разных файлах и дочерний импортируется к родительскому.
Я хочу на изменении testInputValue в дочернем компоненте, обновлять его в родительском
Как правильно это делается?
  • Вопрос задан
  • 45 просмотров
Пригласить эксперта
Ответы на вопрос 2
8XL
@8XL
Я высокий, но ниже, чем вы подумали.
Храните состояние в родительском компоненте и передавайте методы в пропсах дочернему.

class Parent extends React.Component {

    constructor(props) {
        super(props)
        this.testInputValue = ''
    }

    handleChange(event) {
        this.testInputValue = event.target.value
    }

    log_test_input_value = () => {
        console.log(this.testInputValue);
    }

    render() {
        return (
             <div>
              <button onClick={log_test_input_value}>Test log</button>
              <Child onChange={ this.handleChange }/>
            </div>
        )
    }
}
Ответ написан
Вы не читали документацию реакта по ходу.
https://reactjs.org/tutorial/tutorial.html#making-...
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
29 нояб. 2020, в 22:37
500 руб./за проект
29 нояб. 2020, в 20:54
3000 руб./за проект
29 нояб. 2020, в 20:40
25000 руб./за проект