Question

我正在构建我的第一个React本机应用程序，但是在连接到Redux商店时遇到了问题（我对Redux的使用也没有太多经验）。我正在使用博览会。

错误是：

不变违规：在“ Connect（App）”的上下文中找不到“ store”。要么将根组件包装在中，要么在连接选项中将自定义React上下文提供程序传递给Connect（App），并将相应的React上下文使用者传递给Connect（App）。

此错误位于：   在Connect（App）中（withExpoRoot.js：22）   （...）

这是我的代码：

能请你帮忙吗？

// App.js

import React, { Component } from "react";
import AppStackNav from "./navigators/AppStackNav";
import { Provider, connect } from 'react-redux';
import { createStore } from 'redux';
import guestsReducer from "./reducers/GuestsReducer";

const store = createStore(guestsReducer);

class App extends Component {
    constructor(props) {
        super(props);
    }

    addGuest = (index) => {
        // ...
    }

    render() {
        return (
            <Provider store={store}>
                <AppStackNav
                    screenProps={{
                        currentGuests: this.state.currentGuests,
                        possibleGuests: this.state.possibleGuests,
                        addGuest: this.addGuest
                    }}
                />
            </Provider>
        )
    }
}

const mapStateToProps = state => {
    return {
        currentGuests: this.state.current,
        possibleGuests: this.state.possible,
        addGuest: this.addGuest
    };
}

export default connect(mapStateToProps)(App);

// GuestsReducer.js

import { combineReducers } from 'redux';

const INITIAL_STATE = {
    current: 10,
    possible: [
        'Guest1',
        'Guest2',
        'Guest3',
        'Guest4',
    ],
};

const guestsReducer = (state = INITIAL_STATE, action) => {
    switch (action.type) {
        default:
            return state
    }
};

export default combineReducers({
    guests: guestsReducer,
});

// AppStackNav.js

import { createStackNavigator, createAppContainer } from "react-navigation";
import Home from "../screens/Home";
import Dashboard from "../screens/Dashboard";
import Project from "../screens/Project";
import Placeholder from "../screens/Placeholder";

const AppStackNav = createStackNavigator({
    // ...
});

export default createAppContainer(AppStackNav);

Answer 1

第一期

const mapStateToProps = ({ guests }) => {
        return {
            currentGuests: guests.current,
            possibleGuests: guests.possible
        };
      }

第二期

您将Redux存储区连接到App组件的上层组件...，然后使用connect和mapStateToProps访问{{1 }}的上层组件（App）...我的意思是您将商店通过redux store连接到children组件而不是mapStateToProps组件

AppStackNav

App.js

App

Answer 2

您不能在类外使用'this'关键字，因为它将无法理解该特定方法的上下文。

您只需从this删除mapStateToProps关键字

像这样：

const mapStateToProps = state => {
    return {
        currentGuests: state.current,
        possibleGuests: state.possible
    };
}

EXPO的react-native错误：在“ Connect（App）”的上下文中找不到“ store”

2 个答案: