Question

当我单击医生视图时，我制作了一个平板列表屏幕，其中显示了一堆Doctors信息（名称，位置，图片），导航到他的个人资料。目前，配置文件屏幕只是空白，但是我想传递参数，这样我就可以显示它们而无需重新执行api调用。这是研究屏幕的代码，该列表的列表是：

 render(){
      return (
        <View style={styles.main_container}>

            <FlatList 
                data={this.state.dataSource}
                keyExtractor={item=> item.id.toString()}
                renderItem= {({item})=> <MedItem Med={item}  />} />
        </View>
      );
    }

我创建了一个组件自定义医学项目来设置我的平面列表的样式： //Meditem.js

class MedItem extends React.Component {
    render(){
        const Med = this.props.Med
      return (
        <View style={styles.main_container}  >

            <View style={styles.ctr1}>
                <TouchableOpacity onPress={()=>NavigationService.navigate('MedProfil')}>
                    <Image style={styles.img} source={require('../assets/Title.jpg')} />
                </TouchableOpacity>    
                <TouchableOpacity onPress={()=>NavigationService.navigate('MedProfil')}>
                    <Text style={styles.txt}> {Med.name} </Text>
                    <Text style={{flexWrap:'wrap'}} > {Med.specialite} </Text>
                    <Text> {Med.work} </Text>
                </TouchableOpacity>
            </View>
            <View style={styles.ctr2}>
                    <Text style={{textAlign:'center',marginBottom:5}}>Disponibilité</Text>

                    <Calendar/> 


            </View>
        </View>
      );
    }
}

最后这是我的医生档案屏幕：

export default class MedProfilScreen extends React.Component {
  render(){
    return(
      <View>
        <Text>{Med.name}</Text>
        <Button title='Prendre rendez-vous' onPress={()=>{}} />
      </View>
    );
  }
}

有人可以帮我这样做吗？谢谢

Answer 1

通过这样的导航发送数据

this.props.navigation.navigate("MedProfil",
      {
       name:Med.name
      })

在MedProfil屏幕中获取数据

const name=this.props.navigation.getParam("name")

Answer 2

在“发送”组件中使用以下命令：

var cookie = Request.Cookies[HttpUtility.UrlEncode($"myCookie")];

在您的接收组件中

constructor(props) {
    super(props);
    this.navigate = this.props.navigation.navigate; 
}

//Send it like this

this.navigate("MedProfilScreen", { name:Med.name });

Answer 3

谢谢大家！ getParam对我不起作用。我用它来解决问题

TextFormField(

...
autovalidate: true,
validator: (String txt){
  if (txt.length == 10){
    Future.delayed(Duration.zero).then((_){
    setState((){
      _btnEnabled = true;
    });
  });
  } else {
    Future.delayed(Duration.zero).then((_){
    setState((){
      _btnEnabled = false;
    });
  });
  }
}
....

并在配置文件屏幕中 //MedProfil.js

//MedItem.js
<TouchableOpacity onPress={()=>NavigationService.navigate('MedProfil',Med)}>

将数据传递到路线导航React Native

3 个答案: