typescript - 将自定义道具传递给 react-native-bottom-sheet

Question

我在我的项目中使用带有打字稿的https://gorhom.github.io/react-native-bottom-sheet/并且我还使用 CustomBackground 作为我的底页：

interface ICustomBackgroundProps {
  bottomSheetindex: number
}

const CustomBackground = ({
  animatedIndex,
  style,
  bottomSheetIndex
}: BottomSheetBackgroundProps & ICustomBackgroundProps): JSX.Element => {
  // animated variables
  const animatedBackground = useMemo(
    () =>
      interpolateColors(animatedIndex, {
        inputRange: [0, 1],
        outputColorRange: ['#fff', '#fff'],
      }),
    [animatedIndex],
  );

  // styles
  const containerStyle = useMemo(
    () => [style, animatedIndex],
    [style, animatedBackground],
  );

  return (
    <Animated.View style={{ ...containerStyle, flex: 1 }}>
      <View
        style={{ position: 'absolute', left: '50%', top: -20, zIndex: 555555 }}>
        <CustomHandle bottomSheetIndex={bottomSheetIndex} />
      </View>
      <Image
        source={images.BaseShape}
        style={{
          width: WIDTH_SHAPE,
          position: 'absolute',
          top: normalize(-77, 'height'),
          resizeMode: 'cover',
          alignSelf: 'center',
        }}
      />
    </Animated.View>
  );
};

我需要传递一个自定义道具（我的代码中的bottomSheetIndex）但是当我想传递时。它，我有一个错误：“BottomSheetBackgroundProps & ICustomBackgroundProps”类型上不存在属性“bottomSheetIndex”

我怎样才能通过解决这个问题？

标签： typescriptreact-nativeexpobottom-sheet