Как использовать функцию класса для инициализации избыточного состояния?

Question

Я пытаюсь создать избыточное состояние из функции, определенной внутри класса.Я получаю Uncaught TypeError: Cannot read property 'type' of undefined, когда использую:

var c = new Counter(0)
counter = c.state

let store = createStore(counter)

Но если я использую function counter(state = 0, action), то он работает правильно.

import { createStore } from 'redux'

class Counter {
    constructor(s) {
        this.s = s
    }

    state(action) {
        console.log("action" + action)
        switch (action.type) {
        case 'INCREMENT':
            return this.s + 1;
        case 'DECREMENT':
            return this.s - 1;
        default:
            return this.s
        }
    }
}

function counter(state = 0, action) {
  switch (action.type) {
    case 'INCREMENT':
      return state + 1
    case 'DECREMENT':
      return state - 1
    default:
      return state
  }
}

var c = new Counter(0)
counter = c.state

let store = createStore(counter)   // not working

store.subscribe(() => console.log(store.getState()))

store.dispatch({ type: 'INCREMENT' })
store.dispatch({ type: 'INCREMENT' })
store.dispatch({ type: 'DECREMENT' })

export default store

Как использовать класс идать функцию для инициализации состояния?

Answer 1

Когда redux вызывает ваш редуктор, он передается по двум параметрам Первое - это состояние с избыточностью, второе - текущее действие. Это тот случай, независимо от того, что вы называете ваши параметры. Так как ваша функция выглядит так:

state(action) {
  console.log("action" + action)
  switch (action.type) {
  case 'INCREMENT':
      return this.s + 1;
  case 'DECREMENT':
      return this.s - 1;
  default:
      return this.s
  }
}

... тогда состояние редукса будет присвоено ошибочно названной переменной "действие". Между тем, действие не будет назначено ни одному параметру. Исходное состояние редукса не определено, поэтому вы видите это исключение.

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

function counter(state = 0, action) {
  switch (action.type) {
    case 'INCREMENT':
      return state + 1
    case 'DECREMENT':
      return state - 1
    default:
      return state
  }
}

Это не внутри класса, но я не уверен, почему вы хотите, чтобы это было.

Answer 2

Так что вам нужно передать два параметра.

function todos(state = [], action) {
  switch (action.type) {
    case 'ADD_TODO':
      return state.concat([action.text])
    default:
      return state
  }
}
const store = createStore(todos, ['Use Redux'])

Взгляните на https://redux.js.org/api/createstore