Мои ReactJS initialState меняются при изменении моего состояния - PullRequest
0 голосов
/ 27 января 2020

У меня есть что-то вроде:

const initialState={
 hide: true
 product:[
         {name: ''
          price: ''},
          {name: ''
          price: ''},
          {name: ''
          price: ''},
         ]
}

class Products extends Component {
  state = { ...initialState }

}
clearState = () =>{
  this.setState({...initialState})
}

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

Любой совет? Спасибо, кстати

Ответы [ 2 ]

2 голосов
/ 27 января 2020

Ваше начальное состояние все еще хранит ссылку на массив, что означает, что если вы измените массив где-либо еще, он будет меняться везде.

Для решения этой проблемы вы можете использовать функцию, которая создаст новую initialState для вас, чтобы использовать, как это:

const initialState = () => {
    return {
        hide: true,
        product: [
            {name: '', price: ''},
            {name: '', price: ''},
            {name: '', price: ''},
        ]
    };
};

class Products extends Component {
    state = initialState();

    clearState = () =>{
        this.setState(initialState());
    }
}
1 голос
/ 27 января 2020

Что нужно знать о javascript объектах, так это то, что все их свойства, содержащие объект или массив, будут только ссылками ...

Это означает, что если вы просто скопируете его с помощью оператора rest, массив продуктов во всех случаях будет одинаковым ...

Лучший способ добиться этого - создать функцию, возвращающую исходное состояние, или грубое JSON .parse (JSON .stringify). (InitialState)).

...