自动更正在没有作为道具传入的情况下工作



基本上我有一个组件可以像TextInput一样运行,如下所示

//Input.js
import React from 'react';
import { Text, TextInput, View } from 'react-native';
const Input = ({ label, value, onChangeText }) => {
    const { inputStyle, containerStyle, labelStyle } = styles;
    return (
        <View style={containerStyle}>
            <Text style={labelStyle}>{ label }</Text>
            <TextInput
                style={inputStyle} 
                onChangeText={onChangeText}
                value={value}
            />
       </View>
    );
};

我还有另一个组件,它利用上面Input组件的输入

//InputForm.js
import React, { Component } from 'react';
import { Button, Card, CardSection, Input } from './common';
class LoginForm extends Component {
    state = { text: '' };
    render() {
        return (
            <Card>
                <CardSection>
                    <Input 
                        autoCorrect={false}
                        value={this.state.text}
                        onChangeText={text => this.setState({ text })}
                        label='Email'
                    />
                </CardSection>
                <CardSection />
                <CardSection>
                    <Button>
                        Login
                    </Button>
                </CardSection>
            </Card>
        );
    }
}
export default LoginForm;

如第一Input.js所示,我们只收到label, value, onChangeText作为道具,在我的InputForm.js中,我传递了一个额外的道具autoCorrect。现在发生的事情是,自动建议被禁用了。

如果我错了,请纠正我,Input组件是一个自定义组件,它不应该理解autoCorrect的含义,因为我从未定义过Input.js的行为。那么为什么它有效呢?

autoCorrect 的默认值为 true:https://facebook.github.io/react-native/docs/textinput.html#autocorrect

在第二个示例中,您不会看到任何效果,因为您没有像正确所说的那样覆盖 TextInput 中的 autoCorrect 道具。

相关内容

  • 没有找到相关文章

最新更新