numberOfLines TextInput 属性不起作用

Question

我在其中创建了一个应用程序，react-native并且可以选择在消息选项中聊天。当我在 TextInput 内部单击并键入两行时，上面的行被隐藏。为了解决这个问题，我在文档numberOfLines属性中看到了它，但它不起作用。

这是我的代码：

<TextInput

                ref='textInput'
                multiline={true}
                numberOfLines: {5}
                onChangeText={this.onChangeText}
                style={[styles.textInput, {height: context.props.textInputHeight}]}
                placeholder={context.props.placeholder}
                placeholderTextColor="#5A5A5A"
                value={context.state.text}/>

我也在getDefaultProps函数中尝试过：

getDefaultProps() {
    return {
      placeholder: 'Type a message...',
      navHeight: 70,
      textInputHeight: 44,
      numberOfLines:5,
      maxHeight: Screen.height,
    };
  },

但没有奏效。

Answer 1

恢复：

<TextInput
  ...
  numberOfLines={Platform.OS === 'ios' ? null : numberOfLines}
  minHeight={(Platform.OS === 'ios' && numberOfLines) ? (20 * numberOfLines) : null}
/>

Answer 2

您可以使用maxHeight并minHeight接受您想要的东西。对于标准文本 fontSize，指定maxHeight={60}将使 TextInput 在 3 行后可滚动。这对于 IOS 很有用 - 对于 Android，你可以使用numberOfLinesprop.

Answer 3

你有numberOfLines: {5}，应该有numberOfLines={5}。或者这只是SO中的一个错字？

另外，造型textAlignVertical: 'top'也很推荐。