从本机另一个页面更新状态

时间:2020-07-07 00:21:54

标签: reactjs react-native react-native-android

好吧,我是本机新手,但遇到了问题。我需要通过另一页上的按钮来更改变量的状态。

页面结果

import React, { Component } from 'react';
import { StyleSheet, View, Text, Modal, Button } from 'react-native';

export default class VolumeResult extends Component {
  constructor(props) {
    super(props); 
    this.state={
      modal:this.props.show
    }
  }
  
  
  render() {
    return (
      <Modal
        transparent={true}
        visible={this.state.modal}
      >
        <View style={styles.result}>
          <View style={styles.viewmodal}>
            <Text style={styles.texttop}>Informações</Text>
            <Text style={styles.title}>Volume da Piscina: {(this.props.volume)} mil Litros</Text>
            <Text style={styles.title}>{this.props.produtos}</Text>
            <Text style={styles.title}>{this.props.produtoCloro}</Text>
            <Text style={styles.title}>{(this.props.volume*7).toFixed(2)}ml de Algicida e Clarificante {"\n"} 1 vez por semana</Text>
            <Text>{this.props.show}</Text>


            <Button title="Fechar" onPress={()=>{this.setState({modal:false})}} />
          </View>
        </View>
      </Modal>
      
    );
  };
}

页面表单

<View style={{flex:1,justifyContent:"center",alignItems:"center"}}>
    <TouchableOpacity onPress={()=> {
       this.onSubmit();

       this.setState({modal:true})

    }} style={styles.btnCalculo}>
       <Text style={styles.buttonText}>Calcular</Text>
    </TouchableOpacity>
</View>

我需要通过按一下鼠标来更新的模式状态

1 个答案:

答案 0 :(得分:0)

使用可以使用contextredux来管理全局状态。了解React Native here中的全局状态管理。