@gorhom/bottom-sheet - 儿童视图的动态高度

Question

如何通过设置捕捉点或其他方式设置儿童视图的动态高度？ 这是我的父组件和子组件代码。

需要通过删除多余的空格来设置模态的动态高度

child.tsx

import {
 BottomSheetModal,
 BottomSheetModalProps,
 BottomSheetModalProvider,
} from '@gorhom/bottom-sheet';
import { BottomSheetModalMethods } from '@gorhom/bottom-sheet/lib/typescript/types';
import { Portal } from 'react-native-portalize';    

const BottomSheet = forwardRef<BottomSheetModalMethods, Props>(
({ children, snapPoints, handleSheetClose }, ref) => {

const memorizedSnapPoints = useMemo(() => snapPoints, [snapPoints]);

return (
  <Portal>
    <BottomSheetModalProvider>
      <BottomSheetModal
        ref={ref}
        index={1}
        snapPoints={memorizedSnapPoints}
        backdropComponent={(props) => (
          <CustomBackdrop onPress={handleSheetClose} {...props} />
        )}
        handleIndicatorStyle={handler}
        onDismiss={handleSheetClose}
        backgroundStyle={backgroundModal}
      >
        <View style={[flex1, contentContainer]}>{children}</View>
      </BottomSheetModal>
    </BottomSheetModalProvider>
  </Portal>
);
},
);

parent.tsx

<BottomSheet
    ref={bottomSheetModalRef}
    snapPoints={['25%', DEVICE_HEIGHT * 0.35]}
    handleSheetClose={handleSheetClose}
  >

Answer 1

没有干净的方法可以做到这一点而不会让你的组件变得混乱，但是有一个主动拉取请求，所以我们可能很快就会看到这个功能。