首页 > 解决方案 > 在“Connect(App)”的上下文中找不到“store”。要么将根组件包装在

问题描述

在“Connect(App)”的上下文中找不到“store”。要么将根组件包装在 a 中,要么将自定义的 React 上下文提供程序传递给相应的 React

*

我认为问题在于新的反应上下文 api...

查看“魏高”的帖子

https://dev.to/wgao19/upgrading-to-react-redux-v6-around-the-new-context-api-5725

*

import React, { Component } from 'react';
import { Text, View } from 'react-native';
import{connect, Provider} from 'react-redux';

import store  from './Redux/store.js';

const ContextA = React.createContext();
class App extends Component{
  render(){
    return (
      <Provider store = {store} context = {ContextA} > 
        <View >
          <Text> Contacts </Text>
        </View>
      </Provider>
    )
  }
}
const mapStP= state =>({contacts : state.contacts});
export default connect(mapStP, null , null, {context : ContextA})(App);

依赖项

"dependencies": {
    "expo": "^33.0.0",
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "react-native": "https://github.com/expo/react-native/archive/sdk-33.0.0.tar.gz",
    "react-native-web": "^0.11.4",
    "react-redux": "^7.1.0",
    "redux": "^4.0.4"
  },

标签: react-nativereact-redux

解决方案


您已将提供程序的上下文选择为“ContextA”而不是应用程序。所以应用程序中没有上下文的定义。很难确切地弄清楚你想要什么,但你可以像这样解决这个问题。

应用程序.js

import React, { Component } from 'react';
import { Text, View } from 'react-native';

class App extends Component{
  render(){
    return (
        <View >
          <Text> Contacts </Text>
        </View>
    )
  }
}
export default App

你的组件

你的组件.js

const ContextA = React.createContext();
const mapStP= state =>({contacts : state.contacts});
...
return (
    <Provider store={store} context={ContextA}>
      <App />
    </Provider>
);
...
compose(
  connect(mapStP, null, null, { context: ContextA }),
)(Yourcomponent);

推荐阅读