2015-11-18 2 views
3

Построение приложения с использованием React Native, а отдельные сцены отлично работают, очень довольны.Пропустить реквизит до сцен и изменить

Однако теперь я рассматриваю введение какого-либо «глобального» состояния, например, чтобы проверить, имеет ли пользователь активный сеанс, и если это так, добавьте свои данные в какое-либо состояние, которое является общим (или переданным) для остальной части приложение.

Я просто не на 100%, где разместить этот код и где я буду хранить эти данные, чтобы отдельные сцены могли получать доступ (а также так же важно - изменять) эти данные?

У меня был удар при добавлении подпорки к <Navigator />, например, так:

<Navigator user={this.getUser()} /> 

который затем передается в качестве опоры для <SomeScene navigator={navigator} /> но это не чувствует себя хорошо, и я не могу выясните, как затем изменить прописку navigator (скажем, изменения свойств user), после чего эти фильтры изменений возвращаются к основному <Navigator />.

От поиска вокруг я видел Flux и React Router, но не могу найти пример того, что я пытаюсь сделать, так это надеяться, что кто-то может указать мне в правильном направлении.

Заранее спасибо.

+0

Вы используете Flux в своем APP? –

+0

@DhavalPatel Пока нет - как я уже сказал, я не могу найти пример того, что я пытаюсь сделать, если у вас его есть, пожалуйста, поделитесь! –

+0

так просто см. Мой ответ. Я отвечу на ваш вопрос. –

ответ

0

Это может быть достигнуто с помощью Flux, позвольте мне объяснить мне с помощью Flux, Flux - это шаблон, в котором есть Store, и вы можете использовать Store для хранения значения переменной здесь. Я прикрываю ваш пример, который вы хотите хранить информацию о пользователе, и хотите доступ к каждому компоненту, для которого ваш магазин содержит два метода: один - для набора информации пользователя, а второй - для получения информации о пользователе.

Сначала вы должны установить два модуль для этого, используя нижеуказанной команде

НОЙ установку событие подчеркивает --save

var EventEmitter = require('events').EventEmitter; 
var _ = require('underscore'); 

var _user; 

// Extend UserStore with EventEmitter to add eventing capabilities 
var UserStore = _.extend({}, EventEmitter.prototype, { 


    getUserInfo: function() { 
     return _user; 
    }, 
    setUserInfo: function(user) { 
     _user=user; 
    } 
}); 
module.exports=UserStore; 

теперь вы можете использовать его этот магазин из любого компонента например

var UserStore=require('./UserStore'); 

и установить и получить доступ к информации из любого места в вашем приложении, например, установить

UserStore.setUserInfo(user); 
var user=UserStore.getUserInfo(); 
+0

Является ли это только установкой 'npm install events underscore --save'? –

+0

да, вы можете установить его, используя его –

+0

Итак, каждый раз, когда мне нужно получить информацию о пользователе, я вызываю 'UserStore.getUserInfo()', вместо того, чтобы делать 'this.setState ({user: UserStore.getUserInfo()});'? –