поднимая входной дочерний элемент к родительскому объекту - PullRequest
0 голосов
/ 14 февраля 2019

Моя проблема в том, что я хочу поднять свой входной дочерний элемент до родительского объекта.но всякий раз, когда я набираю ввод, он не сохраняется в моем состоянии.думаю, что проблема в pkp[index].Sasaran += question.Sasaran;, как я должен написать этот код.помогите мне пожалуйста ..

родительский компонент

 constructor(props) {
    super(props);
    this.state = {
      selectedOption: [],
      selectedOption2: [],
      pkp: []
    };
   } 
handleChange = question => {
    const pkp = [...this.state.pkp];
    const index = pkp.indexOf(question);
    pkp[index] = { ...question };
    pkp[index].Sasaran = question.Sasaran;
    this.setState({ pkp });
    console.log(this.state.pkp);
  };

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

      <tr>
        <td>{this.props.question.SubVariabel}</td>
        <td>
          <input
            name="sasaran"
            type="number"
            onChange={() => this.props.onChange(this.props.question)}
          />
        </td>
        <td>
          <input
            name="capaian"
            type="number"
            onChange={() => this.props.onChange(this.props.question)}
          />
        </td>
      </tr>

1 Ответ

0 голосов
/ 14 февраля 2019

Значение может обновляться.

const pkp = [...this.state.pkp];
  const index = pkp.indexOf(question);
  pkp[index] = { ...question };
  pkp[index].Sasaran += question.Sasaran;
  this.setState({ pkp });
  console.log(this.state.pkp);
};

Это console.log(this.state.pkp) НЕ покажет новое состояние.SetState не является немедленным.Компонент должен повторно выполнить рендеринг с новым значением, прежде чем оно отобразится в состоянии.Проверьте значение где-нибудь еще (как в рендере), и, возможно, обновление будет отображаться правильно.

Вот еще несколько подробностей о том, как setState работает за кулисами: https://reactjs.org/docs/react-component.html#setstate

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...