React-在默认提供程序中创建连接的提供程序，它将从存储中获取数据并将其作为道具传递给默认提供程序

Question

假设我在应用程序中使用了所需的提供程序，将其命名为MyProvider，并用它包装我的应用程序。该提供程序必须以data1和data2为道具：

const data1 = store.getState().data1;
const data2 = "some data";
<Provider store={store}>
<Myprovider data1={data1} data2={data2}>
<App/>
</Myprovider>
</ Provider>

所以data1是从状态中检索的，而data2是预定义的数据。当data1发生更改时(我的意思是，当调度了一些操作，并且state's data1发生了一些更改时，提供程序不会检测到它(。所以我想到的是创建wrapper for Myprovider，让我们称之为ConnectedMyprovider，它将连接到redux存储，并将data1和data2作为道具传递给Myprovider。

ConnectedMyprovider的代码类似于：

import {connect} from 'react-redux';
import {MyProvider} from 'MyProvider';
function mapStateToProps(state, ownProps) {
const {data1} = state.data1;
const data2 = ownProps.data2;
return {data1: data1, data2: data2};
}
export default connect(mapStateToProps, null)(MyProvider);

然后，将我的应用程序包装为：

const data2 = "some data";
<Provider store={store}>
<ConnectedMyProvider data2={data2}>
<App/>
</ConnectedMyProvider>
</ Provider>

最终出现错误Make sure your <MyProvider> is set up correctly.未提供data2。有人知道怎么做吗？

Answer 1

@Vilva。我直接把它移到ConnectedMyProvider中，并添加了这个部分class ConnectedMyProvider extends Component {:

import {Provider as TranslateProvider} from 'react-translated'; // this is provider I wrapped
class ConnectedMyProvider extends Component {
constructor(props) {
super(props);
}
render() {
return (
<TranslateProvider language={this.props.language} translation={translation} >
<App/>
</TranslateProvider>
);
}
}
function mapStateToProps(state, ownProps) {
return {
language: state.language
};
}
export default connect(mapStateToProps, null)(ConnectedMyProvider);

我将ConnectedMyProvider定义为新的Component，并在render函数中返回Provider(包装的提供程序(。请注意，我还在return语句中放入了<App/>。然后，在索引中，我有ConnectedMyProvider作为渲染方法中的最后一个子项

ReactDOM.render(
<Provider store={store}>
<ConnectedMyProvider />
</ Provider>,
document.getElementById('root')
);

如上所述，<App/>嵌套在ConnectedMyProvider返回语句中，如果我将其嵌套在<ConnectedMyProvider>标记内的index.jsx's渲染函数中，它将不起作用。

Answer 2

我使用redux已经有一段时间了，但你的方法对我来说似乎相当正确。你确定没有命名/语法错误吗？逻辑听起来不错。

尝试检查ownProps.data2是否确实工作。如果不是，这听起来可能是一个愚蠢的建议，但为什么不直接在ConnectedMyProvider上设置data2呢？。