Question

我有一个要在其中调用方法的类。特别是standalone.bat -c standalone-full.xml。最初，我是使用附加在每个FeedCard上的按钮进行导航的，但是它看上去草率，所以我决定使用可触摸的不透明度。

HomeScreen.js

() => this.props.navigation.navigate('Detail')

是否可以传递函数（类似于我在React Native中使用class HomeScreen extends Component { state = { } render() { return( <Root> <List> <FeedCard /> <FeedCard doThis={() => this.props.navigation.navigate('Detail')} /> <FeedCard /> <FeedCard /> <FeedCard /> <FeedCard /> <FeedCard /> </List> </Root> ) } };所做的事情？

FeedCard.js

doThis()

当我将函数直接放入function FeedCard({doThis}) { return ( <Root> <TouchableOpacity onPress={doThis}> <FeedCardHeader /> <CardContainer> <CardContentText> {text} </CardContentText> </CardContainer> <FeedCardBottom /> </TouchableOpacity> </Root> ) };组件的onPress()中时，它返回了<TouchableOpacity>，所以我想知道是否有可能传递类似于我尝试以上的方式。但是使用上面的代码，它根本无法导航。我知道导航有效，因为当我将其放在与HomeScreen相同页面的TypeError: undefined is not an object (evaluating '_this.props')中的onPress()中时，效果很好。

Answer 1

将空白功能传递给其他Feedcard

<FeedCard doThis={() => { }} />
<FeedCard doThis={() => this.props.navigation.navigate('Detail')} />
<FeedCard doThis={() => { }} />
<FeedCard doThis={() => { }} />
<FeedCard doThis={() => { }} />
<FeedCard doThis={() => { }} />
<FeedCard doThis={() => { }} />

如果您不想通过它。执行以下操作

function FeedCard({doThis}) {
    return (
        <Root>
            <TouchableOpacity onPress={() => ÏdoThis}>
                <FeedCardHeader />
                <CardContainer>
                    <CardContentText>
                        {text}
                    </CardContentText>
                </CardContainer>
                <FeedCardBottom />
            </TouchableOpacity>
        </Root>
    )
};

您可以在React-Native组件之间（在不同文件中）传递函数吗？

1 个答案: