反応ネイティブプロバイダクラス

Question

からmobxコールアクションを、私は非常に単純なmobxストアクラスを設定している：

import {observable, action} from 'mobx' 

class TestStore { 
    @observable placeholder = 'Search In Me'; 

    @action changeName(name) { 
this.placeholder = name; 
    } 
} 

export default new TestStore(); 

プロバイダが設定されている場所をマイ親クラス（下記）があります。問題はこのクラスにあります。アクティブな現在のタブのルート名も追跡する必要があります。それはすべてうまくいきます - 私の問題は、ストアのchangeName関数を親クラスから呼び出す方法です。現在this.props.store.changeNameは未定義として返されます。

import React, { Component } from 'react'; 
import { Root, Tabs } from './config/router'; 
import { Alert,View } from 'react-native'; 

import { Provider } from 'mobx-react'; 
import TestStore from './config/TestStore'; 

import {observer} from "mobx-react/native"; 



@observer class App extends Component { 


_getCurrentRouteName(navState) { 

if (navState.hasOwnProperty('index')) { 
    this._getCurrentRouteName(navState.routes[navState.index]) 

} else { 
    if (navState.routeName==='Tab 1') { 
     Alert.alert('Tab 1') 
     this.props.store.changeName('Tab 1') 
    } 
    if (navState.routeName==='Tab 2') { 
     Alert.alert('Tab 2') 
    } 
    if (navState.routeName==='Tab 3') { 
     Alert.alert('Tab 3') 

    } 
    if (navState.routeName==='Tab 4') { 
     Alert.alert('Tab 4') 

    } 

} 

} 

    render() { 
    return (

    <Provider store={TestStore}> 
    <Root onNavigationStateChange={(prevState, newState) => { 
     this._getCurrentRouteName(newState) 

    }} /> 
    </Provider> 

    ) 


    } 
} 

export default App; 

Answer 1

は、だから私はこの問題は私のアプリを再構築し、レベルをすべてを動かす解決 - index.jsは以下となり、背中にindex.jsで、元のクラスをインポート：

import React, { Component } from 'react'; 
import { Provider } from 'mobx-react'; 
import TestStore from './config/TestStore'; 


import Base from './app'; 

class App extends Component { 

    render() { 
    return (

    <Provider store={TestStore}> 
    <Base /> 
    </Provider> 

    ) 


    } 
} 

export default App;