redux 的帮助

Question

我正在从屏幕A导航到屏幕B ..然后使用

导航回到屏幕A.

this.props.navigation.goBack(null);

我想知道在执行此操作时如何传递参数？

这是我的代码

 import React, { Component } from 'react';
 import { View, Text, TextInput, ScrollView } from 'react-native';
 import Card from './Card';
 import CardSection from './CardSection';
 import MyButton from './MyButton';


 class Settings extends Component{
 constructor(props){
 super(props);
 this.state = {
   ip:'',
   port:''
 };
}

onSaveClick() {
 console.log('Button clicked');
 this.props.navigation.goBack();
}
render(){
const { input, container } = styles;
return(
  <View style = {container}>
  <Card>
  <CardSection>
    <TextInput 
      style = {input}
      onChangeText = {(ip) => this.setState({ip})}
      placeholder = "IP Address"
      autoCapitalize = "none"
      autoCorrect = {false}
      keyboardType = "numeric"
    />
    </CardSection>
    <CardSection>
      <TextInput
      style={styles.input}
      onChangeText={(port) => this.setState({port})}
      placeholder="Port Number"
      autoCapitalize="none"
      autoCorrect={false}
      keyboardType = "numeric"
    />
    </CardSection>
    <CardSection>
      <MyButton onPress ={this.onSaveClick.bind(this)}>
        Save
      </MyButton>
    </CardSection>
    <View>
    </View>
   </Card> 
  </View>
);
}
}

那么我怎样才能在前一个组件中设法访问该组件的状态。我们可以将状态作为参数传递吗？

Answer 1

您应该遵循Redux方法

因为将状态/信息从子组件传递回父组件（第二个屏幕到第一个屏幕）是一个糟糕的设计模式，因为这会在应用程序中创建多个数据流路径，这使得调试变得困难。

redux 的帮助

点击提交时，您将数据推送到全局商店。（基本上调度操作并使用reducer更新全局redux商店）
导航回上一个屏幕。
通过connect（来自react -redux包）列出上一页中的这些更改并反映更改。

您可以使用节点包react-redux。

从此处跟进示例 - ＆gt; http://redux.js.org/docs/basics/ExampleTodoList.html

更多有用的示例here。

导航到上一个屏幕时如何传递参数？

1 个答案:

redux 的帮助