Реагировать - не могу изменить число на входе - PullRequest
0 голосов
/ 18 марта 2019

Я отображаю таблицу, используя данные из API, используя axios get.В таблице у меня есть поле ввода со значением из данных axios, но когда я набираю это значение ввода не меняется.Например, если на входе номер 8 из данных и я выбираю вход, а тип 5 на входе - это номер 8.

Как разблокировать поле ввода?

код аксиоса

axios
  .get("http://10.10.10.27/api?", {params : {rok : this.state.rok, idUchwaly : this.state.id}, headers: { 'Authorization' : 'Bearer '+ this.state.token }})
  .then(response =>
    response.data.map(data2 => ({
      IDA: `${data2.id}`,
      Value: `${data2.value}`,


    }))
  )
  .then(data2 => {
    if (data2==''){
      this.setState({ isLoadingdane: false });
    }
    else{
      this.setState({ data2, isLoadingdane: true});
    }
  })
  .catch(error => this.setState({ error }));

}

отображение таблицы в рендере

    <tbody className="row">
{ this.state.isLoadingdane ? (

 data2.map(user => {
  const { IDA, Value } = user;
  return (
      <tr id={IDA}>
        <td ><p>{IDA}</p></td>
        
        <td >
        <input id={IDA} type="text" className="form-control" size="1" name="wnio" onChange={this.ChangeWniosek} value={Value} ></input>
        </td>
        <td >
          <button  onClick={() => this.edit(user)} type="button" className="btn btn-light">Zapisz</button>
        </td>
        
      </tr>

      );

Почтовый метод работает, изменения сохраняются на сервере

1 Ответ

0 голосов
/ 18 марта 2019

Вам нужно найти измененный в данный момент объект из массива data2 и заменить измененное Value новым значением.

Входное значение - это номер 8, потому что вы берете значение ввода из объекта data2, которыйостается неизменным при изменении:

const {IDA, Value} = user;
<input id={IDA} type="text" className="form-control" size="1" name="wnio" onChange={this.ChangeWniosek} value={Value} ></input>```

Только если вы найдете и измените значение в объекте data2 во время onChange, вы сможете увидеть отражение нового значения.

ПРИМЕР:

<input id={IDA} type="text" className="form-control" size="1" name="wnio" onChange={(e) => this.ChangeWniosek(e)} value={Value} ></input>

В функции:

ChangeWniosek = (e) => {
  let { data2 } = this.state;
  data2 = data2.map(obj => {
    if (obj.IDA === e.target.id) {
      obj.Value = event.target.value
    }
    return obj;
  });
  this.setState({
    data2,
    Value: event.target.value
  });
}

Дайте мне знать, если это работает.

...