Получить справку по базовому Redux с React Native? - PullRequest
0 голосов
/ 28 августа 2018

Я новичок как в React в качестве основы, так и в разработке React Native. Я узнал, что лучший способ управлять такими вещами, как уведомления в приложениях и т. Д., - это использовать Redux для работы в качестве менеджера состояний (в некотором роде, я бы предпочел использовать избыточный код за пределами моей области реагирующей навигации)

Я смотрел учебники по редуксу сам по себе (egghead.io), и это имело смысл;

Но каждый учебник по его внедрению в React Native кажется слишком сложным.

Я только хочу передать данные; как результаты сетевого запроса, текущие настройки из Async Storage (вместо загрузки их на каждый отдельный модуль, как я сейчас)

Я понимаю, что отправляю какую-то команду; редуктор интерпретирует это и выводит новое состояние; но я не понимаю, как я могу использовать это на практике.

Мой текущий файл App.js с попыткой повлиять на избыточность, но я понятия не имею, как дочерние стеки / экраны / и т. Д. Могут получать и отправлять новые команды из этого:

/**
 * 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, но я не могу думать о том, что еще делать, и я застрял в спаде разработки, и мне нужно выйти из этого, чтобы оставаться продуктивным):

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...