redux getState() не возвращает обновленное состояние

Question

Проблема, из-за которой я застрял на несколько дней, состоит в том, что, хотя мой redux devtool показывает успешное обновление состояния без каких-либо мутаций и с успешным повторным отображением компонента View, но когда я вызываю getState(), он всегда возвращает исходное состояние и не заботится о обновленное состояние! Любой, кто знает, что может сделать такую ​​ситуацию, пожалуйста, помогите мне.

Я использую реаги-редукс и редукс-стук

action.js

export function test(data) {
  return {
    type: 'TEST',
    data
  };
}

export function testFunc(data) {
  return dispatch => {
    dispatch(test(data))
    console.log('GLOBAL STATE IS :', store.getState() )
  };
}

reducer.js

export default function peopleReducer(state = initialState, action) {
  switch (action.type) {
    case 'TEST':
      return {
        ...state,
        test: action.data
      }
    default:
      return state;
  }
}

Page01.js

componentDidUpdate(){
   console.log('get state = ', store.getState())
}

....

<TouchableHighlight 
   underlayColor={"#0e911b"}
   onPress={() => {
   this.props.testing('test contenttttt !!!!')            
    }}
 >
   <Text style={styles.title}>ACTION</Text>
</TouchableHighlight>



function mapStateToProps(state) {
  return {
    people: state.people,
    planets: state.planets,
    test: state.test
  };
}

function mapDispatchToProps(dispatch) {
  return { 
    getPeople: () => dispatch(getPeopleFromAPI()), 
    getPlanets: () => dispatch(getPlanetsFromAPI()), 
    testing: data => dispatch(testFunc(data)) };
}

export default connect(mapStateToProps, mapDispatchToProps)(App);

Answer 1

Для того, чтобы использовать getState() в файле действий вы должны использовать его непосредственно из хранилища, скорее вы можете получить его как второй параметр внутренней функции вместе с диспетчеризацией при использовании redux-thunk

export function testFunc(data) {
  return (dispatch, getState) => {
    dispatch(test(data))
    console.log('GLOBAL STATE IS :', getState())
  };
}

Также ваше обновленное состояние не будет видно сразу после отправки действия, так как обновление в состоянии избыточного состояния происходит асинхронно. Вы должны проверить это в componentDidUpdate Функция компонента, где вы используете состояние.

Кроме того, чтобы получить обновленное состояние с помощью store.getState() вам нужно подписаться на изменение состояния, как

// Every time the state changes, log it
// Note that subscribe() returns a function for unregistering the listener
const unsubscribe = store.subscribe(() =>
  console.log(store.getState())
)

и ты можешь unsubscribe позвонив

unsubscribe()

Вы можете прочитать больше об этом здесь

Однако, когда вы используете Connect, вам не нужно использовать store.getState() в компоненте вы можете использовать mapStateToProps функция для получения значений состояния.