如何在同一视图中将 react-native-actionsheet 与 react-native-gifted-chat 一起使用？

Question

使用这个天才聊天库https://github.com/FaridSafi/react-native-gifted-chat

我尝试将 ActionSheet 添加到渲染函数，但它不会渲染天才聊天，因为聊天屏幕仅在它是唯一的根视图控件时才有效。

此渲染函数不适用于外部封闭View

return (
  <View>
    <GiftedChat
      messages={this.state.messages}
      onSend={this.onSend}
      onPressAvatar={this.pressProfile}
      user={{
        _id: user.id,
        name: user.username,
        avatar: user.thumbnail,
      }}
    />
    <ActionSheet
      ref={o => this.ActionSheet = o}
      title={title}
      options={options}
      cancelButtonIndex={CANCEL_INDEX}
      destructiveButtonIndex={DESTRUCTIVE_INDEX}
      onPress={this.handlePress}
    />
  </View>
);

如果我必须将根视图设为GiftedChat，我应该将 ActionSheet 视图放在哪里？

Answer 1

你试过了吗？

<GiftedChat
  messages={this.state.messages}
  onSend={this.onSend}
  onPressAvatar={this.pressProfile}
  user={{
    _id: user.id,
    name: user.username,
    avatar: user.thumbnail,
  }}
>
   <ActionSheet
     ref={o => this.ActionSheet = o}
     title={title}
     options={options}
     cancelButtonIndex={CANCEL_INDEX}
     destructiveButtonIndex={DESTRUCTIVE_INDEX}
     onPress={this.handlePress}
  />
</GiftedChat>