我是 MobX 的新手,在这里被推荐。我有一个简单的数组,我试图将它传递给另一个文件。我已经尝试了很多东西,但我无法以 this.props.store 的形式接收数组如果您能对我对 mobX 的不当使用有所了解,将不胜感激。谢谢你。
import React, { Component } from 'react';
import {
Alert,
AppRegistry,
StyleSheet,
Text,
TouchableHighlight,
View
} from 'react-native';
import styles from '../styles/styles.js';
import {observable, extendObservable} from 'mobx';
//unsure why below code wont work, when trying to export it throws error: object is not a constructor (evaluating 'new rNumStore()')
// const rNumStore = observable([1,2,3]);
// a couple of other options both i am unsure why they do not work
// class rNumStore {
// extendObservable(this, {
// rNumbers: [1,2,3]});
// }
// class rNumStore {
// observable({rNumbers: [1,2,3]});
// }
//Current best working solution below
var rNumStore = function(){
extendObservable(this, {
rNumbers: [1,2,3]
});
}
var Button = React.createClass({
rNumberGen: function(){
store.rNumbers = [Math.random(), Math.random(), Math.random()];
var a = store.rNumbers[0].toString();
var d =store.rNumbers.toString();
Alert.alert(a, d);
//this alert gives mobxArray of random numbers
},
render: function(){
return(
<TouchableHighlight onPress={this.rNumberGen} style= {styles.center}>
<Text style={styles.button}>Generate!</Text>
</TouchableHighlight>
);
}
});
var store = new rNumStore;
export default store;
export {Button};
然后第二个文件需要观察数组
import React, { Component } from 'react';
import {
Alert,
AppRegistry,
StyleSheet,
TouchableHighlight,
Text,
View
} from 'react-native';
import{
genre1,
genre2,
genre3
} from './genres.js';
import styles from '../styles/styles.js';
import {observer} from 'mobx-react/native';
var Genre = observer(React.createClass({
alert: function(){
//below does not cause an error.
var a = this.props.store;
//undefined ins not an object(evaluating 'this.props.store.rNumbers')
// have tried making 'a' a state : this.props.store.rNumbers same error occurs at that point
var b = this.props.store.rNumbers[1];
var c = b.toString();
Alert.alert('this is', c);
},
render: function(){
let genre = this.props.selected;
return(
<TouchableHighlight onPress={this.alert}>
<View style={styles.genre}>
<Text style={styles.center}>{genre}</Text>
</View>
</TouchableHighlight>
);
},
}));
module.exports = Genre;