TextInput 在 React Native 上忽略双击(句点)

Som*_*ial 5 textinput reactjs react-native

我有 TextInput 组件,每当用户键入时它都会更改状态,但我意识到由于 TextInput 的值使用 this.state.text 作为值,双击空格不会在 iO 上产生句点。

是否有解决办法,以便双击空间仍然可以在 ios 上产生句点?

 onChange =(text) => {
    this.setState({text});
 }




<TextInput
          onChangeText={this.onChange}
          onSubmitEditing={this.onSubmit}
          value={this.state.text}
          autoCapitalize="sentences"
          blurOnSubmit={false}
          editable={true}
        />
Run Code Online (Sandbox Code Playgroud)

Bat*_* G. 1

import React, { Component } from 'react';
import { AppRegistry, TouchableOpacity, View, TextInput } from 'react-native';

class UselessTextInput extends Component {
    constructor(props) {
        super(props)
        this.state = {
            lastPress: 0
        }
    }

    onPress = () => {
        var delta = new Date().getTime() - this.state.lastPress;

        if (delta < 200) {
            alert("DOUBLE TAP")
            // double tap happend
        }

        this.setState({
            lastPress: new Date().getTime()
        })
    }

    render() {
        return (
            <TouchableOpacity onPress={this.onPress}>
                <TextInput
                    pointerEvents="none"
                />
            </TouchableOpacity>
        );
    }
}

export default class UselessTextInputMultiline extends Component {
    constructor(props) {
        super(props);
        this.state = {
            text: 'Useless Multiline Placeholder',
        };
    }

    // If you type something in the text box that is a color, the background will change to that
    // color.
    render() {
        return (
            <View style={{
                backgroundColor: this.state.text,
                borderBottomColor: '#000000',
                borderBottomWidth: 1
            }}
            >
                <UselessTextInput
                    multiline={true}
                    numberOfLines={4}
                    onChangeText={(text) => this.setState({ text })}
                    value={this.state.text}
                />
            </View>
        );
    }
}

// skip these lines if using Create React Native App
AppRegistry.registerComponent(
    'AwesomeProject',
    () => UselessTextInputMultiline
);
Run Code Online (Sandbox Code Playgroud)

您可以根据您的要求编辑它,我已经在反应本机文档网站上尝试过它并且它有效。