React-Native TextInput不支持输入中文解决办

写在前面，最近因接手公司新项目，React-Native0.55.4版本，发现TextInput 在iOS平台上无法输入中文的问题。

37463182-60980ba0-288f-11e8-82f2-281cd722f342.gif

先上一张修复后的效果图

37642754-b51faa54-2c61-11e8-8627-e3887cdde47f.gif

至此，官网资料上并未有过多的提及只是针对value/defultValue属性的简单叙述

WechatIMG18.jpeg
WechatIMG19.jpeg

最终在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,应该是破掉了。

事实证明，我还是太年轻了，项目中由于很多都地方使用了defultValue和value属性，所以在详细的测试中发现，以上封装只能满足于value属性的情况下没问题的，那么还需要满足defultValue属性了，想到此，修改了代码后，commond + R 再行测试，perfect!

以下为封装后的代码，各位看官，拿去不谢！

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 &&  
           (nextProps.defaultValue == undefined || nextProps.defaultValue == '' )) || 
           (this.props.defaultValue === nextProps.defaultValue &&  (nextProps.value == undefined || nextProps.value == '' ));
  
  }

  render() {
    return <TextInput {...this.props} />;
  }
};

export default MyTextInput;

本人入门选手，代码有点丑陋，目前是解决了我的问题，但愿也能解决您项目中的问题，各位看官不喜勿碰！

• 参考资料
  https://github.com/facebook/react-native/pull/18456
  https://reactnative.cn/docs/0.51/textinput.html#content