发送 prop 然后将其用作 React 中的函数?
Sending prop and then using it as a function in React?
我正在尝试发送一个 RouteKey
道具,然后尝试在链式函数中使用该道具。
这是我的组件:
<MenuItem RouterKey={'assetsList'} />
在组件定义中,我试图在动作函数中使用它,如下所示:
import { Actions } from 'react-native-router-flux';
const MenuItem = (props) => {
return (
<TouchableWithoutFeedback onPress={() => { return `${Actions}.${props.RouterKey}()`; }}>
<View>
//somethings here...
</View>
</TouchableWithoutFeedback>
);
};
基本上我想做的是:
<TouchableWithoutFeedback onPress={() => { Actions.whateverWasPassed(); }}>
但是,我无法做到这一点。我在这里错过了什么?我知道我这样做的方式是错误的。正确的做法是什么?
您可以通过ClassName[methodName]()
动态调用任何静态方法。当您将方法名称作为字符串时,它特别有用。 (就像你的情况一样)。
所以在你的情况下,它将是
<TouchableWithoutFeedback onPress={() => { return Actions[props.RouterKey]();}}>
您可以遵循的另一种方法是,您可以直接将 Actions.assetsList
方法作为 prop 传递并在 MenuItem
组件中调用它。
<MenuItem scene={Actions.assetsList} />
现在,在您的 MenuItem
组件中,您可以调用此方法作为 props.scene()
。这两种方法都可以正常工作。
这是我 关于类似问题的 link。
我正在尝试发送一个 RouteKey
道具,然后尝试在链式函数中使用该道具。
这是我的组件:
<MenuItem RouterKey={'assetsList'} />
在组件定义中,我试图在动作函数中使用它,如下所示:
import { Actions } from 'react-native-router-flux';
const MenuItem = (props) => {
return (
<TouchableWithoutFeedback onPress={() => { return `${Actions}.${props.RouterKey}()`; }}>
<View>
//somethings here...
</View>
</TouchableWithoutFeedback>
);
};
基本上我想做的是:
<TouchableWithoutFeedback onPress={() => { Actions.whateverWasPassed(); }}>
但是,我无法做到这一点。我在这里错过了什么?我知道我这样做的方式是错误的。正确的做法是什么?
您可以通过ClassName[methodName]()
动态调用任何静态方法。当您将方法名称作为字符串时,它特别有用。 (就像你的情况一样)。
所以在你的情况下,它将是
<TouchableWithoutFeedback onPress={() => { return Actions[props.RouterKey]();}}>
您可以遵循的另一种方法是,您可以直接将 Actions.assetsList
方法作为 prop 传递并在 MenuItem
组件中调用它。
<MenuItem scene={Actions.assetsList} />
现在,在您的 MenuItem
组件中,您可以调用此方法作为 props.scene()
。这两种方法都可以正常工作。
这是我