万年素人からHackerへの道

万年素人がHackerになれるまで殴り書きするぜ。

  • ・資産運用おすすめ
    10万円は1000円くらい利益
    • ・寄付お願いします
      YENTEN:YYzNPzdsZWqr5THWAdMrKDj7GT8ietDc2W
      BitZenny:ZfpUbVya8MWQkjjGJMjA7P9pPkqaLnwPWH
      c0ban:8KG95GXdEquNpPW8xJAJf7nn5kbimQ5wj1

    MobXをReactNativeで

    qiita.com この辺参考

    これらいれた。

    yarn add babel-plugin-transform-decorators-legacy
    yarn add mobx-react
    yarn add mobx

    .babelrcには追加。

     {
       "presets": ["babel-preset-expo"],
    +  "plugins": ["transform-decorators-legacy"],
       "env": {
         "development": {

    こんな風にRootStackの上にもできた

    import * as React from 'react';
    import { StyleSheet, Text, View, Button } from 'react-native';
    import { Provider } from 'mobx-react';
    import { createStackNavigator } from 'react-navigation';
    import { GameScreen } from './Game';
    import { DetailScreen } from './Detail';
    import MyNumberStore from './stores/MyNumberStore';
    
    const myNumberStore = new MyNumberStore();
    const stores = {
      myNumber: myNumberStore,
    };
    
    class HomeScreen extends React.Component {
      render() {
        return (
          <View style={styles.container}>
            <Text style={styles.title}>OikuraPp!</Text>
            <Text>Make a good guess Number !</Text>
            <Button
              title="Start"
              onPress={() => this.props.navigation.navigate('Game')}
            />
            <Button
              title="Settings"
              onPress={() => this.props.navigation.navigate('Details')}
            />
            <Text style={styles.copyright}>(c)shinriyo</Text>
          </View>
        );
      }
    }
    
    const styles = StyleSheet.create({
      container: {
        flex: 1,
        backgroundColor: '#fff',
        alignItems: 'center',
        justifyContent: 'center',
      },
      title: {
        fontSize: 90,
      },
      copyright: {
        fontSize: 12,
        position: 'absolute',
        bottom: 50
      },
    });
    
    const RootStack = createStackNavigator(
      {
        Home: HomeScreen,
        Game: GameScreen,
        Details: DetailScreen,
      },
      {
        initialRouteName: 'Home',
      }
    );
    
    export default class App extends React.Component {
      render() {
        // return <RootStack />;
        return (
          <Provider {...stores}>
            <RootStack />
          </Provider>
        );
      }
    }
    const stores = {
      myNumber: myNumberStore,
    };

    ここで設定したものが、他の場所のインジェクトしたとこで@inject('myNumber')で使える

    @inject('myNumber')
    @observer
    export class GameScreen extends React.Component<{}> {
      answers: string[] = [];
      myNumber: string = '';