Как нажать или обновить состояние в NgRx?

#javascript #angular #typescript #ngrx #ngrx-store

#javascript #angular #typescript #ngrx #ngrx-магазин

Вопрос:

Я пытаюсь добавить значение inputVal в состояние. Это работает только при первом нажатии и получении этой ошибки после

Ошибка: TypeError: Cannot add property 1, object is not extensible

 import { createReducer, on } from '@ngrx/store'
import { addTodo } from '../actions/todo.actions'

export const initialState: any[] = []
let test: any[] = []

const _todoReducer = createReducer(
  initialState,
  on(addTodo, (state: any, { inputVal }) => {
    test.push(inputVal)
    state = test
    return state
  })
)

export function todoReducer(state, action) {
  return _todoReducer(state, action)
}
  

Как мне нажать или обновить состояние в NgRx? или, если это невозможно, как обойти это?

Ответ №1:

Вы никогда не сможете изменить state вход NgRx , редуктор вернет новую копию состояния, а не изменит существующую. Таким образом, вы не можете добавить test в state

попробуйте

 const _todoReducer = createReducer(
  initialState,
  on(addTodo, (state: any, { inputVal }) => {
    return [...state,inputVal] // we are creating a new array and this will become the new state.
  })
)
  

Ответ №2:

Например, в вашем компоненте, пожалуйста, введите хранилище constructor(private store:Store){..}

Хранилище можно обновить с помощью this.store.dispatch(addTodo("element"))

но есть еще одна проблема. Ваше хранилище должно быть неизменяемым, поэтому вы не можете повторно test использовать массив в reducer.

 const _todoReducer = createReducer(
  initialState,
  on(addTodo, (state: any, { inputVal }) => {
    return [...state, inputVal]
  })
)
  

достаточно.