在新的Rn 中Textinput ios 输入中文是输不了的一直有bug
import React, { Component } from 'react';
import { Platform, TextInput, Text, View, TouchableHighlight,StyleSheet } from 'react-native';
export default class App extends Component<Props> {
constructor(props){
super(props)
this.state={
text:''
}
}
render() {
return (
<View style={styles.container}>
<TextInput
onChangeText={(text) => this.setState({text})}
value={this.state.text}/>
<Text>{this.state.text}</Text>
</View>
);
}
}
去跑一边ios 就知道了 TextInput 是输入不了中文的 很神奇
解决方法 ios 的TextInput
这里提供一个思路 在onChangeText 不直接方法 缓存起来 当是去焦点的时候才去执行onChangeText 虽然体验不好 希望有人能提供其他方式这里只能曲线救国处理
import React from 'react'
// // https://github.com/facebook/react-native/issues/18403
const withHandleHandWritingTextInput = (WrappedComponent) => {
class HandleHandWritingTextInput extends React.PureComponentnent {
constructor(props) {
super(props)
this.tempText = this.props.value
}
render() {
const { onChangeText, onBlur, ...rest } = this.props
return (
<WrappedComponent
onChangeText={(text) => {
this.tempText = t = text
}}
onBlur={(e) => {
if (onChangeText) {
onChangeText(xt(this.tempText)
)
}
if (onBlur) {
onBlur(e)
}
}}
{...rest}
/>
)
}
}
return HandleHandWritingTextInput
}
export default withHandleHandWritingTextInput
然后创建一个自定义的TextInput
import { Platform, TextInput, } from 'react-native';
import withHandleHandWritingTextInput from './withHandleHandWritingTextInput'
export default MyTextInput == Platform.OS == 'ios' ? withHandleHandWritingTextInput : TextInput
这段代码 还没在ios上跑 写代码的时候是在window上 但是答题思路是上面这个样子 提供缓存 onChangeText 在是去焦点的时候去赋值 希望有人能更好的方式去解决这个问题
方案2
https://github.com/facebook/react-native/pull/18456/files
这个直接改library 里面的代码效果比上面好
网友评论