首页 > 解决方案 > 在使用提供者包裹的屏幕中未收到道具

问题描述

我是新手,所以请帮忙。

我不想将整个应用程序包装在上下文提供程序周围,而是只想包装特定流程 App -> Dashboard -> Provider{ List -> Details}

我已经让它在流程中工作,但现在这里的问题是我没有在列表屏幕中获得任何道具,有人可以检查并提供帮助吗?

创建数据上下文模板 ::

export default (reducer, actions, initialState) => {
    const Context = React.createContext();

    const Provider = ({ children }) => {
        const [state, dispatch] = useReducer(reducer, initialState);

        const boundActions = {};
        for (let key in actions) {
            boundActions[key] = actions[key](dispatch);
        }

        return (
            <Context.Provider value={{ state, ...boundActions }}>
                {children}
            </Context.Provider>
        );
    };

    return { Context, Provider };
};

导航::

<NavigationContainer>
        <Stack.Navigator initialRouteName="Dashboard" screenOptions={{
            headerBackTitleVisible: false
        }}>
            <Stack.Screen name="Dashboard" component={DashboardScreen} />
            <Stack.Screen name="NewsList" component={ListWithProvider} />
        </Stack.Navigator>
    </NavigationContainer>

ListWithProvider::

export const ListWithProvider = () => {
    return <ListProvider>
        <ListScreen/>
    </ListProvider>
};

列表提供者::

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

const setData = (dispatch) => {
  return (source) =>{
    dispatch({type:"setData", payload: source});
  }
}
export const { Context, Provider } = CreateDataContext(
  reducer,
  { setData },
  {loading: false, data: null, error: null, filter: "all"}
);

标签: reactjsreact-nativereact-reduxreact-hooksreact-context

解决方案


推荐阅读