Question

我在HomeScreen.js中有一个组件LatestAdded.js，当按下它时，我想导航到另一个名为ProductDetailScreen.js的屏幕，但是当HomeScreen.js呈现时，我遇到了一个问题，它直接导航到ProductDetailScreen.js，并且如果我按下后退按钮并导航到HomeScreen.js，然后按下LatestAdded.js组件，则会显示错误true不是函数（评估this.props.viewdetail（））

LastedAdded.js

 <TouchableWithoutFeedback onPress={() => {
            this.props.viewdetail();
        }}>

            <View style={{
                flex: 1,
                flexDirection: 'row',
                borderRadius: 4,
                borderWidth: 0.5,
                borderColor: '#d6d7da', width: 180, padding: 5, marginRight: 5, height: 120
            }}>
                <View style={{}}>
                    <Text style={{ fontSize: 15, marginTop: 20 }}> {this.props.title}</Text>
                    <Text style={{ fontSize: 15, fontWeight: '700', marginTop: 10, marginBottom:10 }}> {this.props.author}</Text>
                    <StarRating
                        disabled={false}
                        maxStars={5}
                        starSize= {10}
                        rating={3}
                        fullStarColor= '#EDC430'
                        selectedStar={(rating) => this.onStarRatingPress(rating)}
                    />


                </View>
                <Image style={{ width: 80, height: 100, margin: 2 }} source={{ uri: this.props.image }} />

            </View>

        </TouchableWithoutFeedback>

在HomeScreen.js中渲染methon

 renderItem = ({ item }) => {
return (
  <LatestAdded title={item.pro_name} author={item.pro_price} image={item.img_path}
   viewdetail = { this.props.navigation.navigate('ProductDetail',{pro:item.pro_id})} />
)}

ProductDetailScreen.js

class ProductDetailScreen extends Component {

render() {
const { navigation } = this.props;
const itemId = navigation.getParam('pro', 'none');
    return (
        <View style={styles.container}>
            <Text>{itemId}</Text>
        </View>
    );
}

}

Answer 1

您的问题在这里：

posts: [Post!]!

您想传递一个函数以便稍后调用，但是您可以立即调用该函数

尝试以下方法：

viewdetail = { this.props.navigation.navigate('ProductDetail',{pro:item.pro_id})}

反应本地导航并导航到另一个屏幕问题

1 个答案: