Что является альтернативой textarea в реакции-родной?
Есть ли встроенный компонент текстовой области для реакции-native? Я попытался реализовать эти:
https://github.com/buildo/react-autosize-textarea
https://github.com/andreypopp/react-textarea-autosize
но получив сообщение об ошибке "Ожидаемый объект класса получил объект объекта".
Ответы
Ответ 1
Да, есть. Он называется TextInput, обычный компонент TextInput поддерживает несколько строк.
Просто присвойте следующие свойства вашему компоненту TextInput
multiline = {true}
numberOfLines = {4}
В конце вы должны иметь это:
<TextInput
multiline={true}
numberOfLines={4}
onChangeText={(text) => this.setState({text})}
value={this.state.text}/>
Ответ 2
Я использую этот компонент:
https://www.npmjs.com/package/react-native-autogrow-textinput
Он автоматически расширяет рост текста. Я создал свой собственный многократно используемый компонент с помощью функции autogrow-textinput как часть его, которая внутри компонента выглядит следующим образом:
<AutoGrowingTextInput
minHeight={40}
maxHeight={maxHeight} // this is a flexible value that I set in my
component, where I use this reusable component, same below, unless
specified the other
onChangeText={onChangeText}
placeholder={placeholder}
placeholderTextColor='#C7C7CD'
style={inputStyle}
value={value}
/>
Ответ 3
Если вы используете только компоненты, отвечающие за реакцию, ваш параметр TextInput
Как объяснил "funkysoul":
Просто присвойте следующие свойства вашему компоненту TextInput
multiline = {true}
numberOfLines = {4}
Если вы хотите увидеть этот компонент как классический textarea
(больше, чем встроенный ввод текста), вам обычно нужно добавить свойство стиля height
. См. Следующий пример:
<TextInput
multiline={true}
numberOfLines={10}
style={{ height:200, backgroundColor:'red'}}
/>
Я добавил backgroundColor для лучшего понимания роли height
. Не используйте его в своем проекте;)