mapStateToProps передает реквизиты как пустой объект

Question

Я пытаюсь добавить Redux в свое приложение React Native. Существует приложение Decider, которое должно контролировать, отображается или нет <Intro /> или <Content />.

У меня никогда не было проблем с подключением редукса, и я пробовал разные варианты, поэтому я, должно быть, здесь что-то делаю не так. К сведению, единственная причина, по которой у меня есть компонент <Decider />, заключается в том, что <App /> является корневым компонентом, и, насколько я понимаю, у вас не может быть Provider и connect() на одном и том же компоненте.

Реквизит проходит как пустой объект. Что я делаю неправильно?

App.js

import Intro from './pages/Intro';
import Content from './pages/Content';
const store = createStore(rootReducer)

export default class App extends Component {
  render() {
    return (
      <Provider store={store}>
        <Decider /> 
      </Provider>
    )
  }
}

class Decider extends Component {
  render() {
    return this.props.showIntro ? <Intro /> : <Content />
  }
}

const mapStateToProps = state => {
  return {
    showIntro: state.showIntro
  }
}

connect(mapStateToProps)(Decider)

. / Редукторы / index.js

[...auth reducer...]

const viewControl = (state = true, action) => {
  switch (action.type) {
    case ON_INTRO_COMPLETION:
      return action.payload
    default:
      return state;
  }
};

export default rootReducer = combineReducers({ auth, viewControl });

. / Действия / index.js

export const onIntroCompletion = bool => {
    return {
        type: 'ON_INTRO_COMPLETION',
        payload: false
    }
}

Answer 1

С Редакция документов

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

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

Возможно, вы захотите попробовать что-то вроде этого:

export default rootReducer = combineReducers({ 
    auth, 
    viewControl,
    showIntro: showIntro => showIntro
});

Answer 2

Ваше действие возвращает: payload: true, а редуктор предоставляет его как весь объект состояния (true или false).

Но, когда вы connect() ваш компонент, вы назначаете попытку извлечь из state.showIntro.

В вашем редукторе попробуйте это:

case ON_INTRO_COMPLETION:
  return {showIntro: action.payload};