Question

我想在我的应用中的两个页面之间传递数据，但我的主页只在我的应用重启时重新加载数据，但我的第二页打印并立即存储我的数据

这是我的第二页

  import React, { Component } from 'react';
  import  {
  TouchableHighlight,
  TouchableOpacity,
  AsyncStorage,
  AppRegistry,
  StyleSheet,
  Navigator,
  TextInput,
  ListView,
  onPress,
  Button,
 Image,
 Text,
View,
  } from 'react-native';


var styles = require('../style.js');

 var count;


class config extends React.Component {
constructor(props) {
 super(props);
 this.state = { local: '',
                ext: '',
              };
}

componentWillMount() {
    AsyncStorage.getItem("local").then((value) => {
        this.setState({"local": value});
    }).done();
    AsyncStorage.getItem("ext").then((value) => {
        this.setState({"ext": value});
    }).done();
}

  saveData(target, value, i) {
  if (i === 1){
    AsyncStorage.setItem("local", value);
     this.setState({local: value});
  }
   else{
       AsyncStorage.setItem("ext", value);
       this.setState({ext: value});
   }
 }


render(){
return(

  <View>

  <View style={styles.container}>
    <Image source={require('../../img/mob.png')} style={styles.mob_logo}/>
  </View>

    <View style={{marginTop:100}}>
      <Text style={{fontSize:20}}>Hello From config component</Text>
      <Text>id: {this.props.id}</Text>
      <Text>name: {this.props.name}</Text>
      <Text>name: {this.props.myVar}</Text>
      <Text style={styles.saved}>
          {this.state.local}
      </Text>
        <Text> </Text>
      <TextInput
        style={{height: 40, borderColor: 'gray', borderWidth: 1}}
        onChangeText={(local) => this.saveData("local",local,1)}
        value={(local) => this.saveData("local",local,1)}
      />

      <Text style={styles.saved}>
          {this.state.ext}
      </Text>
      <TextInput
        style={{height: 40, borderColor: 'gray', borderWidth: 1}}
        onChangeText={(ext) => this.saveData("ext",ext,2)}
        value={(ext) => this.saveData("ext",ext,2)}
      />
    </View>
    </View>
)
}
}

  module.exports = config;

我想将本地和分机传递给我的1页任何建议吗？

Answer 1

如果两个页面没有父子关系，则可以使用flux体系结构在组件之间共享数据。

您可以使用React-Redux

在两页之间重新加载数据

1 个答案: