React Native - 如何更改气泡样式

Question

我正在尝试从反应本机更改聊天气泡的背景颜色。

这里看起来很简单：https://github.com/FaridSafi/react-native-gifted-chat/issues/493

这正是我添加的代码，但后来我得到了

You likely forgot to export your component from the file it's defined in.
Check the render method of `Message`.

这导致我尝试了一堆不同的东西，但没有奏效。我知道它一定非常简单，但我对 React Native 几乎一无所知：/

你知道为什么会这样吗？提前感谢！

Answer 1

如果要为两个用户显示不同的颜色，这将起作用。它还接受其他文本样式。

import { GiftedChat, Bubble, Time} from 'react-native-gifted-chat';

 <GiftedChat
    messages={messages}
    onSend={newMessage => onSend(newMessage)}
    renderBubble={props => {
      return (
        <Bubble
          {...props}
          textStyle={{
            right: {
              color: 'white',
              fontFamily: "CerebriSans-Book"
            },
            left: {
              color: '#24204F',
              fontFamily: "CerebriSans-Book"
            },
          }}
          wrapperStyle={{
            left: {
              backgroundColor: '#E6F5F3',
            },
            right: {
              backgroundColor: "#3A13C3",
            },
          }}
        />
      );
    }}                
    user={{
        _id: 1,
    }}
/>

Answer 2

你有导入泡泡吗？

import { GiftedChat, Bubble } from 'react-native-gifted-chat';

您是否已将渲染气泡函数设置为GiftedChat的道具，如下所示？

<GiftedChat
            messages={this.state.messages}
            onSend={this.onSend}
            renderBubble={this.renderBubble}
            user={this.state.currentUser}
            showUserAvatar={true}
 />