如何隐藏React Native焦点输入边框?

问题描述 投票:0回答:2

文本聚焦时总会有蓝色边框。我已经设置了样式borderWidth:0,但是还是有边框。我也尝试过设置边框颜色,也是不行。

有什么提示吗?

没什么特别的,我从 expo 选项卡样板开始。 我还发现自动对焦也无法触发:(

import * as React from "react";
import { StyleSheet } from "react-native";
import { TextInput } from "react-native-gesture-handler";

import EditScreenInfo from "../components/EditScreenInfo";
import { Text, View } from "../components/Themed";

export default function TabOneScreen() {
  return (
    <View style={styles.container}>
      <Text style={styles.title}>Tab One</Text>
      <View
        style={styles.separator}
        lightColor="#eee"
        darkColor="rgba(255,255,255,0.1)"
      />
      <TextInput
        autoFocus={true}
        placeholder="here is a input"
        style={{ padding: 4, borderBottomWidth: 2 }}
      />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    alignItems: "center",
    justifyContent: "center",
  },
  title: {
    fontSize: 20,
    fontWeight: "bold",
  },
  separator: {
    marginVertical: 30,
    height: 1,
    width: "80%",
  },
});

react-native expo
2个回答
5
投票

您可以尝试将outlineStyle 设置为“none”吗?这将删除所有边框样式

<TextInput style={{outlineStyle: 'none' }} />

0
投票

导出 const SearchBox =({onChangeText,onFocus,onBlur})=>{ 返回(

<View style={{ width: '13%', height: '100%', justifyContent: 'center', alignItems: 'center', borderLeftWidth: 2, borderLeftColor: '#0499BC', backgroundColor: '#00B2E3' }} >
    <Image source={require('../../../../assets/searchi.png')} style={{ height: vs(10), width: vs(10) }} />
</View>

) }

它不适用于 ts

enter image description here

© www.soinside.com 2019 - 2024. All rights reserved.