react-native - 如何在表单字段中添加占位符和多行文本输入?反应原生
问题描述
如何在表单字段中添加占位符和多行文本输入?反应原生?
我想在我的主题行中添加一个占位符,并且我想让我的消息字段多行我试图添加占位符和多行,但我认为我没有正确使用它。请帮帮我
import React, { Component } from 'react';
import { View, StyleSheet, Button, TextInput } from 'react-native';
import t from 'tcomb-form-native';
const Form = t.form.Form;
const User = t.struct({
name: t.String,
email: t.String,
subject: t.String,
message: t.String
});
const formStyles = {
...Form.stylesheet,
formGroup: {
normal: {
marginBottom: 10
},
},
controlLabel: {
normal: {
color: 'blue',
fontSize: 18,
marginBottom: 7,
fontWeight: '600'
},
// the style applied when a validation error occours
error: {
color: 'red',
fontSize: 18,
marginBottom: 7,
fontWeight: '600'
}
}
}
const options = {
fields: {
name: {
error: 'Please enter your name',
},
email: {
error: 'Please enter your email adress'
},
message: {
error: 'Please enter message'
},
},
stylesheet: formStyles,
};
export default class App extends Component {
handleSubmit = () => {
const value = this._form.getValue();
console.log('value: ', value);
}
render() {
return (
<View style={styles.container}>
<Form
ref={c => this._form = c}
type={User}
options={options}
/>
<Button
title="Send Message"
onPress={this.handleSubmit}
/>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
justifyContent: 'center',
marginTop: 50,
padding: 20,
backgroundColor: '#ffffff',
},
});
https://snack.expo.io/SJiexSeiW
到目前为止链接到我的代码以在小吃博览会中查看
解决方案
推荐阅读
- c# - C# MS Word 互操作性 - 如何拉伸填充表格中的最后一列
- python - 正确组合数据帧
- r - R - 底图功能 - 自定义轴
- python - Python Zeep 为肥皂请求引发未知错误
- sql-server - 无法从 SQL Server 发送带有查询结果的电子邮件
- sql - SQL - 根据日期时间创建一个不同的列表
- python-3.x - 如何在python中创建一个迭代器类,它将以相反的顺序遍历输入?
- django - 如何使用石墨烯突变信息访问 django 请求
- python - 使用官方网站的 CIFAR-10 数据集进行梯度爆炸
- node.js - AWS Lambda 在 50 毫秒内随机获取操作超时