他のファイルからネイティブの変数を渡します。

Question

私はネイティブに反応するのが初めてで、あるファイルから別のファイルに変数を渡す際に問題があります。

module.exportsはクラスを渡すときに効果的です。 しかし、エクスポートすることによって、変数をファイルからファイルに渡す方法はありますか？

以下の例では、1つのファイル（ボタン）が乱数の配列を作成しており、別のファイル（genreSelector）でその配列にアクセスしたいとします。同様に私は（genreからgenreSelectorへ）文字列の配列を渡そうとしています。

私はこれを行う方法の例を見つけることができないので、私はそれが不可能であるという印象を受けています。これが不可能な場合、どのように情報を渡すべきですか？ 私のメインにすべての機能を持たせ、子クラスからそれらを呼び出す必要がありますか？もしそうなら、自分のthis.functionではなく親クラスの機能をどのように参照するのですか？

メインはindex.android.jsでレンダリングされており、すべてがうまくいきます。もちろん、ファイルからファイルへの配列の受け渡し。私は州を使用しようとしましたが、依然として必要に応じて変数にアクセスできません。

このような基本的な質問に対する謝罪は、このような複雑な方法で求められました。

//this is button.js 
import React, { Component } from 'react'; 
import { 
    Alert, 
    AppRegistry, 
    StyleSheet, 
    Text, 
    TouchableHighlight, 
    View 
} from 'react-native'; 
import styles from '../styles/styles.js'; 

let rNumbers = [1,2,3]; 
var Button = React.createClass({ 

    rNumberGen: function(){ 
     let rNumbers = [Math.random(), Math.random(), Math.random()]; 
    }, 

    render: function(){ 
     return(
       <TouchableHighlight onPress={this.rNumberGen} style={styles.center}> 
         <Text style={styles.button}>Generate!</Text> 
       </TouchableHighlight> 
      ); 
    } 

}); 

module.exports = rNumbers; 
module.exports = Button; 

//これはgenreSelector

import React, { Component } from 'react'; 
import { 
    Alert, 
    AppRegistry, 
    StyleSheet, 
    Text, 
    View 
} from 'react-native'; 
import{ 
    genre1, 
    genre2, 
    genre3 
} from './genres.js'; 
import rNumbers from './button.js'; 
import styles from '../styles/styles.js'; 

let a = rNumbers.toString(); 
Alert.alert('This is', a); 

var Genre = React.createClass({ 

    render: function(){ 

     let genre = this.props.selected; 
     return(
       <View style={styles.genre}> 
        <Text style={styles.center}>{genre}</Text> 
       </View> 
      ); 
    } 
}); 

module.exports = Genre; 

//ですこれはあなたがそのように割り当てることによって、それを上書きしているmain.js

import React, { Component } from 'react'; 
import { 
    AppRegistry, 
    StyleSheet, 
    Text, 
    View 
} from 'react-native'; 
import 
    Button 
    from './button.js'; 
import 
    Genre 
    // genres 
    from './genreSelector.js'; 
import 
    styles 
    from '../styles/styles.js'; 


class Main extends React.Component { 
    render(){ 
    return(
     <View style={styles.container}> 
      <Text style={styles.title}>Genre Genrerator</Text> 

      <Text style={[styles.h2, styles.h21]}>I am listening to</Text> 
      <View style={styles.genreContainer}> 
       <Genre selected='{genres[1]}'/> 
       <Genre selected='{genres[2]}'/> 
       <Genre selected='{genres[3]}'/> 
      </View> 
      <Text style={styles.h2}>You filthy casual</Text> 
      <Button/> 
     </View> 
    ); 
    } 
} 

module.exports = Main; 

Answer 1

module.exports = rNumbers; 
module.exports = Button; 

です。

export {rNumbers}; 
export {Button}; 

は、そのようにようにインポートします：

import {rNumbers} from './button.js'; 
import {Button} from './button.js'; 

編集：エラー：期待を{輸出した後は、exportキーワードを使用する必要があります。

に追加