Question

我在this.state.members中有一个简单的名称数组。我使用了map函数来迭代成员。我想为每个成员添加一个按钮，因此，当我单击它们时，我会转到每个成员专用的屏幕。我测试了按钮是否超出了循环，它正在工作。但是对于map函数内部的人来说，它说“未定义不是对象（评估'_this2.props.navigation'） onPress” 我花了一整天的时间试图了解发生了什么事，但没有任何运气。任何帮助将不胜感激。这是我的代码

import { StyleSheet, Text, View } from "react-native";
import { ListItem, Button } from "react-native-elements";

export default class ProfileScreen extends React.Component {
 static navigationOptions = {
   header: null
 };

 constructor(props) {
   super(props);
   this.state = {
     members: ["Allie", "Gator", "Lizzie"],
     id_groupe: "",
     groupe: ""
   };

   // this.handleSubmit = this.handleSubmit.bind(this);
 }
 render() {
   const members = this.state.members;
   const namesList = members.map(function(name, i) {
     return (
       <Button
         onPress={() => this.props.navigation.navigate("Home")}

         title={name}
         key={i}
       />
     );
   });

   return (
     <View style={styles.container}>
       <View>{namesList}</View>
       <View>
         <Button
           title="Back to home"
           onPress={() => this.props.navigation.navigate("Home")}
         />
       </View>
     </View>
   );
 }
}

const styles = StyleSheet.create({
 container: {
   flex: 1,
   backgroundColor: "#fff",
   alignItems: "center",
   justifyContent: "center"
 }
});

Answer 1

只需使用箭头功能，就不会出现this问题。但是不确定您的实际问题，如果箭头功能起作用，让我们检查是否还有其他问题。地图迭代时的箭头功能：

const namesList = members.map((name, i) => {
     return (
       <Button
         onPress={() => this.props.navigation.navigate("Home")}
         title={name}
         key={i}
       />
     );
   });

有没有办法在react-native的数组映射结果内部进行在线导航？

1 个答案: