Question

在花了几个小时弄清楚如何从 react-native 中的另一个功能组件静态调用一个函数之后。我有一个名为 SnackbarFC 的组件，我想在按下按钮时调用它：

    SnackBar.show({
      message: ArabicPlaceholders.Copy,
      autoHide: true,
      copyStyle: true,
      color: '#484848'
    })

为了到达那里，我创建了一个接口：

type ISnackbar = {
show: (options: SnackbarOptions) => void;}

然后

type SnackbarOptions = {
    color?: string
    onPress?: () => void
    onLongPress?: () => void
    message?: string
    pressable?: boolean
    copyStyle?: boolean
    autoHide?: boolean
}

然后我做

    show(options: SnackbarOptions) {
        console.log("options", options);
        return (
            <SnackbarFC
                color={options.color}
                message={options.message}
                onPress={options.onPress}
                onLongPress={options.onLongPress}
                pressable={options.pressable}
                autoHide={options.autoHide}
                copyStyle={options.copyStyle}
            />
        );
    }
}

最后，这是组件的样子

export const SnackbarFC = (props: SnackbarOptions) => {

    const animation = useRef(new Animated.Value(0)).current;

    const fadeIn = () => {
        Animated.timing(animation, {
            toValue: 1,
            duration: 800,
            useNativeDriver: true
        }).start();
    }.....

当我做`console.log("options", options);` 但是 SnackbarFC 没有被触发，所以如果我在这个组件中添加一个日志，什么都不会发生。

如果有人能帮我解决问题，我真的很感激:(

提前致谢:)

从另一个组件静态调用功能组件

0 个答案: