react-native 0.55.4版本,发现TextInput 在iOS平台上无法输入中文的问题。

1. github上相关资料

import React, {Component} from 'react';
import {Platform, TextInput} from 'react-native'; class MyTextInput extends Component {
shouldComponentUpdate(nextProps){
return Platform.OS !== 'ios' || this.props.value === nextProps.value;
}
render() {
return <TextInput {...this.props} />;
}
};
export default MyTextInput;

代码加入到项目中后,试运行了下发现果然是可以的,以为至此不能输入中文的bug,应该是破掉了。

2.需要满足defultValue和value属性

项目中由于很多都地方使用了defultValue和value属性,所以在详细的测试中发现,以上封装只能满足于value属性的情况下没问题的,那么还需要满足defultValue属性了。

以下为封装后的代码:

import React, {Component} from 'react';
import {Platform, TextInput} from 'react-native'; class MyTextInput extends Component {
shouldComponentUpdate(nextProps) {
const { value, defaultValue } = this.props;
return Platform.OS !== 'ios'
|| (value === nextProps.value && !nextProps.defaultValue)
|| (defaultValue === nextProps.defaultValue && !nextProps.value);
} render() {
return <TextInput {...this.props} />;
}
}; export default MyTextInput;

另: native-base中Input,Textarea等组件在ios平台下不能输入中文

react-native中TextInput在ios平台下不能输入中文的更多相关文章

  1. native-base中Input,Textarea等组件在ios平台下不能输入中文

    在上文react-native中TextInput在ios平台下不能输入中文已经解决. 但是在native-base中Input和Textarea都存在这样的问题.为了不要写多个组件,封装以下代码: ...

  2. React Native之微信分享(iOS Android)

    React Native之微信分享(iOS Android) 在使用React Native开发项目的时候,基本都会使用到微信好友或者微信朋友圈分享功能吧,那么今天我就带大家实现以下RN微信好友以及朋 ...

  3. React Native之TextInput的介绍与使用(富文本封装与使用实例,常用输入框封装与使用实例)

    React Native之TextInput的介绍与使用(富文本封装与使用实例,常用输入框封装与使用实例) TextInput组件介绍 TextInput是一个允许用户在应用中通过键盘输入文本的基本组 ...

  4. react native中使用echarts

    开发平台:mac pro node版本:v8.11.2 npm版本:6.4.1 react-native版本:0.57.8 native-echarts版本:^0.5.0 目标平台:android端收 ...

  5. WEB通知和React Native之即时通讯(iOS Android)

    WEB通知和React Native之即时通讯(iOS Android) 一,需求分析 1.1,允许服务器主动发送信息给客户端,客户端能监听到并且能接收. 1.2,为了方便同一个系统内的用户可以指定某 ...

  6. React Native 之 TextInput使用

    前言 学习本系列内容需要具备一定 HTML 开发基础,没有基础的朋友可以先转至 HTML快速入门(一) 学习 本人接触 React Native 时间并不是特别长,所以对其中的内容和性质了解可能会有所 ...

  7. [转] 「指尖上的魔法」 - 谈谈 React Native 中的手势

    http://gold.xitu.io/entry/55fa202960b28497519db23f React-Native是一款由Facebook开发并开源的框架,主要卖点是使用JavaScrip ...

  8. [转] 在React Native中使用ART

    http://bbs.reactnative.cn/topic/306/%E5%9C%A8react-native%E4%B8%AD%E4%BD%BF%E7%94%A8art 前半个月捣腾了一下Rea ...

  9. 《React Native 精解与实战》书籍连载「React Native 中的生命周期」

    此文是我的出版书籍<React Native 精解与实战>连载分享,此书由机械工业出版社出版,书中详解了 React Native 框架底层原理.React Native 组件布局.组件与 ...

随机推荐

  1. Helm 3 发布 | 云原生生态周报 Vol. 27

    作者 | 墨封.元毅.冬岛.敖小剑.衷源 业界要闻 1.Helm 3 发布 美国时间 11 月 13 日,Helm 团队发布 Helm 3 第一个稳定版本.Helm 3 以 Helm 2 的核心特性为 ...

  2. 002.Kubernetes简单入门实例

    一 环境准备 1.1 基础环境 Kubernetes模式:单机版 系统环境:CentOS 7/172.24.9.157 部署方式:yum快速部署 其他设置:开启NTP.关闭防火墙及SELinux 二 ...

  3. python线程threading.Timer源码解读

    threading.Timer的作用 官方给的定义是: """Call a function after a specified number of seconds: t ...

  4. C# VI: 删除字符串中指定字符的几种方法

    本文基于Stackoverflows上以下几个Question: Fastest way to remove chars from string (http://stackoverflow.com/q ...

  5. Spring Boot2 系列教程(二十四)Spring Boot 整合 Jpa

    Spring Boot 中的数据持久化方案前面给大伙介绍了两种了,一个是 JdbcTemplate,还有一个 MyBatis,JdbcTemplate 配置简单,使用也简单,但是功能也非常有限,MyB ...

  6. 力扣(LeetCode)Excel表列序号 个人题解

    给定一个Excel表格中的列名称,返回其相应的列序号. 例如, A -> 1 B -> 2 C -> 3 ... Z -> 26 AA -> 27 AB -> 28 ...

  7. inventory

    1.设置主机的默认inventory mode. 2. 设置自动Populate 数据

  8. 护网杯2019 mergeheap --pwn

    护网 又是签到 一天 这道题一开始 不懂得如何泄露 libc 信息,就蒙了  后来群里师傅也是刚刚好 做出 到这里 我就接着做了 . 先看下保护,发现  全开了 然后 就看下流程 大概 就是添加  c ...

  9. Netty学习篇⑥--ByteBuf源码分析

    什么是ByteBuf? ByteBuf在Netty中充当着非常重要的角色:它是在数据传输中负责装载字节数据的一个容器;其内部结构和数组类似,初始化默认长度为256,默认最大长度为Integer.MAX ...

  10. 【python测试开发栈】—python内存管理机制(二)—垃圾回收

    在上一篇文章中(python 内存管理机制-引用计数)中,我们介绍了python内存管理机制中的引用计数,python正是通过它来有效的管理内存.今天来介绍python的垃圾回收,其主要策略是引用计数 ...