TextInput组件在ios上自带输入法下无法输入中文的情况 ---- react-native 0.55

最近,遇到了一个情况,react-native的TextInput组件在ios平台只有自带输入法(没有安装其他的第三方输入法)的情况下,没有办法输入中文。

大概原因:react-native在0.55的版本下,TextInput组件有一些的bug!!不能使用它的 value 或 defaultValue 属性!!

代码如下:

情况1:

<TextInput
    underlineColorAndroid="transparent"
    style={{height: 40, flex:1,paddingHorizontal:6}}
    onChangeText={(text) => this.setState({taskName : text})}
    value={this.state.taskName}     //初始值为空字符串
    placeholder='添加任务名称'
/>

情况2:

<TextInput 
    underlineColorAndroid="transparent"
    multiline={true}
    style={{
         borderWidth: 1,
         borderColor: '#E8E8E8',
         borderRadius: 6,
         height: 180,
         padding: 10,
         textAlignVertical:'top',
    }}
    defaultValue={this.state.taskDesc}       //初始值为空字符串
    placeholder='请添加描述'
    onChangeText={(text) => this.setState({taskDesc : text})}
/>

在以上两种情况下,用ios的自带输入法输入中文时,没有可以选择的中文字符,只能输入英文。

解决办法:去除 value 或 defaultValue 属性!!!

即:

<TextInput
    underlineColorAndroid="transparent"
    style={{height: 40, flex:1,paddingHorizontal:6}}
    onChangeText={(text) => this.setState({taskName : text})}
    placeholder='添加任务名称'
/>

//或

<TextInput 
    underlineColorAndroid="transparent"
    multiline={true}
    style={{
         borderWidth: 1,
         borderColor: '#E8E8E8',
         borderRadius: 6,
         height: 180,
         padding: 10,
         textAlignVertical:'top',
    }}
    placeholder='请添加描述'
    onChangeText={(text) => this.setState({taskDesc : text})}
/>

 

文章仅为本人学习过程的一个记录,仅供参考,如有问题,欢迎指出!

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值