如何在 TextInput React Native 中键入时隐藏标签答案

【问题标题】：How Can I hide the label while typing in the TextInput React Native如何在 TextInput React Native 中键入时隐藏标签
【发布时间】：2021-07-28 20:13:57
【问题描述】：

我正在处理本机项目，我正在使用 Text 和 TextInput 创建页面，我希望在我输入 TextInput Field 时标签的文本消失。这是TextInput的代码：

<TextInput
            label="Classification"
            keyboardType="default"
            underlineColor="#009688"
            blurOnSubmit={false}
            // editable={false}

            theme={{
              colors: {primary: '#009688'},
            }}
            style={ThirdScreenStyle.Text}></TextInput>

这是样式 ThirdScreenStyle.Text：

Text: {
backgroundColor: 'transparent',
marginBottom: 5,
marginLeft: 30,
width: 300,
fontSize: 11,
padding: 3,


 },

我希望标签分类消失，我也想减小 TextInput 字段的大小。

【问题讨论】：

标签： react-native

【解决方案1】：

使用 TextInput 的 onFocus 属性保存状态。使用该状态有选择地显示或隐藏文本/标签 <Text>{focused&&"Classification"}</Text> “focused”来自您从 onFocus 方法修改的状态。

【讨论】：

我实际上不知道如何启动专注，你能给我代码吗？

【解决方案2】：

没有名为“标签”的 TextInput 道具，我认为您正在寻找的是“占位符”。

<TextInput
            placeholder="Classification"
            keyboardType="default"
            underlineColor="#009688"
            blurOnSubmit={false}
            // editable={false}

            theme={{
              colors: {primary: '#009688'},
            }}
            style={ThirdScreenStyle.Text}/>

否则，您的标签应该在一个单独的组件中，并使用@Yogesh 的 onFocus 方法。

【讨论】：