Изменяется константа в ReactJS + HashRouter

286
08 января 2018, 12:09

Есть файл с компонентом, который участвует в головном файле с маршрутами Router. В файле есть импорт константы, которая является двумерным массивом:

import {defaultPositions} from '../consts/board';

В конструкторе в state базовое значение равноценно константе

FIGURES_POS: DEFAULT_POSITIONS

Проблема следующая: при обновлении состояния компонента - меняется и константа, даже при переходе на другую страницу приложения с помощью HashRouter. Только при реальном обновлении страницы она принимает исходное состояние. Как избавиться от этого?

Answer 1

Приветствую

Не совсем понятно, почему вы импортируете defaultPositions, а в компоненте используете DEFAULT_POSITIONS. Если допустить, что это одна и также переменная, и учитывая, что мы не видели ваш код, возможно проблема заключается в том, что, так как объекты в js передаются по ссылке, а не по значению, в каком-то месте вы мутируете её значение.

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

Чтобы скопировать значение, так как у вас массив массивов (это не двумерный массив, кстати), надо делать deep clone. То есть или использовать библиотеку типа https://www.npmjs.com/package/clone-deep или написать свою функцию

const cloneDeep = (arr: any[][]) => arr.map(x => x.map(y => y))

если вложенные элементы - объекты, то и их надо копировать

const cloneDeep = (arr: any[][]) => arr.map(x => x.map(y => {...y}))

Надеюсь я вас правильно понял

READ ALSO
Лайки и избранное

Лайки и избранное

Во вью у меня такой блок:

362
Всплывающее окно в Visual Code

Всплывающее окно в Visual Code

При написании метода после того как ставлю скобки вылезает такое большое окно (это не окно подсказок, потому что если писать код дальше будет...

283
Сокращение js скриптов

Сокращение js скриптов

На сайте к странице подключается около 15 js скриптов и 10 css файлов, будет ли профит если свести весь js и css в один файл, те

248
Обработка button

Обработка button

Только начал изучение JS, поэтому, вероятнее всего, допустил какую-то глупую ошибкуЗамысел такой: пользователь вводит кличку, породу и вес...

232