代码之家 › 专栏 › 技术社区 › KetZoomer Gael Ramirez

在Web上的React Native中单击时文本输入周围的边框

textinput react-native

0

KetZoomer Gael Ramirez · 技术社区 · 5 年前

未单击时:

单击时:

React本机版本:4.12.0

Npm版本:6.14.6

最小可复制示例: https://snack.expo.io/@ketzoomer/dfbbdf

import * as React from 'react';
import { View, Text, TextInput } from 'react-native';

class Sign_Up extends React.Component {

    constructor() {
        super();
        
        this.state = {
        };
    }

    render() {
        return (
            <View>
                <Text>
                    First Name:
                    <TextInput
                        style={{ paddingVertical: 0, borderBottomWidth: 1, marginLeft: 5 }}
                        value={this.state.firstName}
                        onChangeText={(firstName) => this.setState({ firstName: firstName })}
                        placeholder="First Name"
                    />
                </Text> 
            </View>
        );
    }
}

export default Sign_Up;

我试过了 outline: 0 但它没有起作用。

我试过了 outlineWidth: 0 但它没有起作用。

我试过了 borderWidth: 0

0 回复 | 直到 5 年前

1

5

manishg 5 年前

outline: 'none' 将按照其他人在评论中提到的方法进行操作。我试过用你的 snack 这似乎奏效了。以下是编辑: https://snack.expo.io/ro0icIt!6 . 请参见下面的代码:

render() {
        return (
            <View>
                <Text>
                    First Name:
                    <TextInput
                        style={{ paddingVertical: 0, outline: 'none', borderBottomWidth: 1, marginLeft: 5 }}
                        value={this.state.firstName}
                        onChangeText={(firstName) => this.setState({ firstName: firstName })}
                        placeholder="First Name"
                    />
                </Text> 
            </View>
        );
    }

2

4

TheEhsanSarshar 4 年前

outline: 'none' 他不再工作了。相反,我们可以使用

outlineStyle: 'none'