Question

作为框架和React Native开发我都是新手我了解到，管理应用内通知等内容的最佳方法是使用Redux充当状态管理器（在某种程度上，我更愿意在我的React导航范围之外使用Redux）

我自己观看了关于redux的教程（egghead.io），这很有意义；

但是我发现在React Native中实现它的每个教程似乎都太复杂了。

我只希望传递数据；例如网络请求结果，异步存储中的当前设置（而不是像我当前一样将其加载到每个不同的模块中）

我知道我会发出各种命令；减速器对此进行解释并输出新状态；但是我不明白我怎么能实际使用它。

我当前的App.js试图隐含redux，但我不知道子堆栈/屏幕/等如何从中访问和调度新命令：

/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 *
 * @format
 * @flow
 */

import React from 'react';
import { createBottomTabNavigator,createStackNavigator } from 'react-navigation';
import SearchTab from './components/Tabs/SearchTab';
import HomeTab from './components/Tabs/HomeTab';
import ScannerTab from './components/Tabs/ScannerTab';
import SettingsTab from './components/Tabs/SettingsTab';
import Ionicons from 'react-native-vector-icons/Ionicons';
import StockModal from './components/Modals/StockModal';
import NotificationModal from './components/Modals/NotificationModal';

//redux
import { createStore, combineReducers, applyMiddleware } from 'redux';
import { Provider } from 'react-redux';
import logger from 'redux-logger';

import navigation from './redux/reducers/reducer'

const reducer = combineReducers({ navigation });
const store = createStore(reducer, applyMiddleware(logger));

class Root extends React.Component {
    render() {
        return (
            <Provider store={store}>
                <RootStack

                />
            </Provider>
        );
    };
}

//Connect everything
export default Root;

const MainStack = createBottomTabNavigator(
    {
        Home: HomeTab,
        Search: SearchTab,
        Scanner: ScannerTab,
        Settings: SettingsTab,
        //Todo: Total overlay modals HERE
    },
    {
        navigationOptions: ({ navigation }) => ({
            tabBarIcon: ({ focused, tintColor }) => {
                const { routeName } = navigation.state;
                let iconName;

                if (routeName === 'Home') {
                    iconName = `ios-information-circle${focused ? '' : '-outline'}`;
                } else if (routeName === 'Settings') {
                    iconName = `ios-options${focused ? '' : '-outline'}`;
                }else if (routeName === 'Scanner') {
                    iconName = `ios-barcode${focused ? '' : '-outline'}`;
                }else if (routeName === 'Search') {
                    iconName = `ios-search${focused ? '' : '-outline'}`;
                }
                return <Ionicons name={iconName} size={25} color={tintColor} />;
            },
        }),
        tabBarOptions: {
            activeTintColor: 'tomato',
            inactiveTintColor: 'gray',
        },
    }
);

RootStack = createStackNavigator(
    {
        Main: {
            screen: MainStack,
        },
        QuickStockModal: {
            screen: StockModal,
        },
        NotificationModal: {
            screen: NotificationModal,
        }
    },
    {
        mode: 'modal',
        headerMode: 'none',
        cardStyle:{
            backgroundColor:"transparent",
            opacity:0.99
        }
    }
);

我的减速器是一个非常简单的实现；

export default (state = {}, action) => {
    switch(action.type) {
        case 'GET_SERVER':
            return {
                ...state,
                server: action.payload
            };
        default:
            return state;
    }
}

只是想返回国家；或传递基本数据

但是我不明白我什么时候可以真正访问调度功能。

我无法将点连接起来；我知道这不是SO的最合适的问题，但是我想不出还有什么办法，并且陷入了低迷的开发明智之举，因此我必须摆脱它以保持生产力）：

使用React Native掌握基本Redux吗？

0 个答案: