Кажется, у меня проблемы с отправкой данных в массив состояний. Я пытаюсь добиться этого следующим образом:

this.setState({ myArray: this.state.myArray.push('new value') })

Но я считаю, что это неправильный способ и вызывает проблемы с изменчивостью?

Отправка массива возвращает длину

this.state.myArray.push('new value')возвращает длину расширенного массива вместо самого массива. Array.prototype.push () .

Я думаю, вы ожидаете, что возвращаемое значение будет массивом.

Неизменность

Похоже, это скорее поведение React:

НИКОГДА не изменяйте this.state напрямую, так как последующий вызов setState () может заменить произведенную вами мутацию. Относитесь к this.state как к неизменяемому. React.Component .

Думаю, вы бы сделали это так (не знаком с React):

var joined = this.state.myArray.concat('new value');
this.setState({ myArray: joined })

Используя es6, это можно сделать так:

this.setState({ myArray: [...this.state.myArray, 'new value'] }) //simple value
this.setState({ myArray: [...this.state.myArray, ...[1,2,3] ] }) //another array

Синтаксис распространения

Никогда не рекомендуется напрямую изменять состояние.

Рекомендуемый подход в более поздних версиях React - использовать функцию обновления при изменении состояний, чтобы предотвратить состояние гонки:

Вставить строку в конец массива

this.setState(prevState => ({
  myArray: [...prevState.myArray, "new value"]
}))

Вставить строку в начало массива

this.setState(prevState => ({
  myArray: ["new value", ...prevState.myArray]
}))

Отправить объект в конец массива

this.setState(prevState => ({
  myArray: [...prevState.myArray, {"name": "object"}]
}))

Переместить объект в начало массива

this.setState(prevState => ({
  myArray: [ {"name": "object"}, ...prevState.myArray]
}))

Вы вообще не должны управлять государством. По крайней мере, не напрямую. Если вы хотите обновить свой массив, вы захотите сделать что-то вроде этого.

var newStateArray = this.state.myArray.slice();
newStateArray.push('new value');
this.setState(myArray: newStateArray);

Работать непосредственно с государственным объектом нежелательно. Вы также можете взглянуть на помощников неизменяемости React.

https://facebook.github.io/react/docs/update.html

Вы можете использовать .concatметод для создания копии вашего массива с новыми данными:

this.setState({ myArray: this.state.myArray.concat('new value') })

Но будьте осторожны с особым поведением .concatметода при передаче массивов - [1, 2].concat(['foo', 3], 'bar')приведет к [1, 2, 'foo', 3, 'bar'].

Этот код работает для меня:

fetch('http://localhost:8080')
  .then(response => response.json())
  .then(json => {
  this.setState({mystate: this.state.mystate.push.apply(this.state.mystate, json)})
})

Реагировать-Native

если вы также хотите, чтобы пользовательский интерфейс ur (например, ur flatList) был в актуальном состоянии, используйте PrevState: в примере ниже, если пользователь нажимает кнопку, он добавит новый объект в список (как в модели, так и в пользовательском интерфейсе). )

data: ['shopping','reading'] // declared in constructor
onPress={() => {this.setState((prevState, props) => {
return {data: [new obj].concat(prevState.data) };
})}}. 

Следующим способом мы можем проверить и обновить объекты

this.setState(prevState => ({
    Chart: this.state.Chart.length !== 0 ? [...prevState.Chart,data[data.length - 1]] : data
}));

Здесь вы не можете поместить объект в массив состояний, подобный этому. Вы можете продвигаться по-своему в обычном массиве. Здесь вы должны установить состояние,

this.setState({ 
     myArray: [...this.state.myArray, 'new value'] 
})

Если вы просто пытаетесь обновить состояние вот так

   handleClick() {
        this.setState(
{myprop: this.state.myprop +1}
        })
    }

Рассмотрим этот подход

   handleClick() {
        this.setState(prevState => {
            return {
                count: prevState.count + 1
            }
        })
    }

По сути, prevState пишет this.state для нас.