javascript - 关闭键盘后禁用 TextInput

Question

使用 React Native TextInput，当在键盘可见时点击后退按钮（屏幕截图中的红色 1）时，可以稍后编辑 TextInput 值。但是，当点击检查/输入图标（屏幕截图中的红色 2）时，无法在键盘消失后更改 TextInput。之后点击输入时，插入符号在点击期间出现，但随后消失，没有任何反应。

这是我的组件：

export class MyInput extends Component {
    constructor (props) {
        super(props);
        this.state = {
            inputValue: `${Date.now()}-document`,
        };

        this.onFocus = this.onFocus.bind(this);
    }
    onFocus (text) {
        if (this.placeholderRemoved) {
            return text;
        }
        this.textInput.clear();
        this.placeholderRemoved = true;

        return '';
    }
    render () {
        return (
            <KeyboardAvoidingView>
                <TextInput
                     value={this.state.inputValue}
                     onChangeText={(text) => {
                         this.setState({inputValue: text});
                     }}
                />
            </KeyboardAvoidingView>
        );
    }
}

经测试：

小米 Pocophone F1，安卓 8.1
谷歌 Pixel 2（模拟器），Android 7.1.1

关闭键盘后如何启用 TextInput 的编辑？

在@Sean Wangs 请求后编辑

import React, {Component} from 'react';
import {AppRegistry, View} from 'react-native';
import {MyInput} from './myInputViewComponent';

export default class myApp extends Component {
  render() {
    return (
      <View>
        <MyInput />
      </View>
    );
  }
}

AppRegistry.registerComponent('myApp', () => myApp);

"react": "16.7.0", "react-native": "0.57.6",

score 1 · Accepted Answer

我能够重现您的问题，这确实是 RN 版本的问题0.57.6。所以在这种情况下你的解决方案是使用 RN 版本0.57.7或更高版本，这个问题应该得到解决。

这被进一步确认为0.57.6状态的发布日志，该状态作为引入的问题TextInput已修复0.57.7和打开。

参考：https ://github.com/facebook/react-native/releases/tag/v0.57.6

score 0 · Accepted Answer

使用模拟器或模拟器的软键盘。您可以从硬件菜单中检查键盘属性并在那里搜索。

javascript - 关闭键盘后禁用 TextInput

2 回答 2

Related

Reference