如何在用户单击输入时清除 TextInput "placeholder"？

Question

我想知道如何在用户单击字段进行填充时清除 TextInput 中的 "placeholder"。

这是我的文本输入：

 <TextInput 
   style={{height:40, borderColor: 'gray', borderWidth:1}}
   onChangeText={(text) => this.setStoreName(text)}
   value={this.state.storeName}
 />

还有我的构造函数：

 constructor(props) {
    super(props)
    this.state = { 
        name: "Votre nom", 
        storeName: "Le nom de votre commerce", 
        email: "Votre email", 
        address: "L'adresse de votre commerce", 
        city: "Votre ville", 
        category: "Categorie", 
        password: "Votre mot de passe"
    }
}

提前致谢。

Answer 1

使用值为 TextInput placeholder

的 placeholder 属性

<TextInput 
 style={{height:40, borderColor: 'gray', borderWidth:1}}
 onChangeText={(text) => this.setStoreName(text)}
 value={this.state.storeName}
 placeholder="Le nom de votre commerce"
/>

在构造函数中

constructor(props) {
 super(props)
 this.state = { 
    name: "", 
    storeName: "", 
    email: "", 
    address: "", 
    city: "", 
    category: "", 
    password: ""
 }
}

Answer 2

您应该像这样使用 TextInput：

constructor(props) {
 super(props)
 this.state = { 
    name: "", 
    storeName: "", 
    email: "", 
    address: "", 
    city: "", 
    category: "", 
    password: "",
    placeholder: "initial value"
 }
}    

   <TextInput 
     style={{height:40, borderColor: 'gray', borderWidth:1}}
     onChangeText={(text) => this.setStoreName(text)}
     value={this.state.storeName}
     placeholder={this.state.placeholder}
     onFocus={() => this.setState(placeholder: '')}
    />

当然，最好在 class 函数体中的 render 函数之外定义函数，然后在 JSX 中使用它们。

如何在用户单击输入时清除 TextInput "placeholder"？

How to clear TextInput "placeholder" when user click on the input?

textinput

react-native