如何自动调整 React Native Gifted Chat Input 的大小？

Question

我使用 React Native Gifted Chat 时遇到问题，当文本输入超过两行或用户使用 enter 时，TextInput 不会自动调整大小。喜欢下图:

这是我的代码：

  <GiftedChat
            placeholder={'Type Here'}
            messages={this.state.messages}
            onSend={messages => {
              this.onSend(messages)
              this._sendChatMessage(messages[0].text)

            }}
            user={{
              _id: 'CUSTOMER',
            }}
            maxComposerHeight={200}
            scrollToBottom
            alignTop
            // minInputToolbarHeight={200}
            // maxInputLength={200}
            renderSend={this.renderSend}
            renderBubble={this.renderBubble}
            renderInputToolbar={this.state.isFinishOrder ? this.renderInputToolbarFinish : this.renderInputToolbar}
            renderAvatar={null}
            renderDay={null}
            renderTime={this.renderTime}
            renderFooter={this.renderFooter}
            isCustomViewBottom={true}

我希望 React Native Gifted Chat 上的 TextInput 自动调整大小。请帮忙。谢谢

Answer 1

您并没有真正显示您用来在 renderInputToolbar 中调用的函数。所以我只能 assumption.If 我的回答没有涵盖你请更新你的 post 包含 this.renderInputToolbar。

默认情况下，textInput 使用 autoResize，所以我只能假设您忘记在 Input 中传递道具，所以：

///Pass props
renderInputToolbar = (props) => {

        return ( 
                 <InputToolbar 
                    {...props} 
       //Add the extra styles via containerStyle here
       //Add any other option you want to pass like placeholder
                 />;
       );
    }