प्रतिक्रिया मूल में टेक्स्ट इनपुट प्लेसहोल्डर की स्टाइल कैसे बदलें?

Question

क्या प्रतिक्रियात्मक मूल में टेक्स्ट इनपुट के placeholder के लिए fontStyle: 'italic'केवल सेट करने का कोई तरीका है?

देख रहे हैं here at the documentation ऐसा लगता है कि आप केवल प्लेसहोल्डर और प्लेसहोल्डर टेक्स्टक्लोर सेट कर सकते हैं।

Answer 1

एक अधिक सामान्य समाधान के लिए डैनियल जवाब पर में सुधार

class TextInput2 extends Component { 
    constructor(props) { 
    super(props); 
    this.state = { placeholder: props.text.length == 0 } 
    this.handleChange = this.handleChange.bind(this); 
    } 
    handleChange(ev) { 
    this.setState({ placeholder: ev.nativeEvent.text.length == 0 }); 
    this.props.onChange && this.props.onChange(ev); 
    } 
    render() { 
    const { placeholderStyle, style, onChange, ...rest } = this.props; 

    return <TextInput 
     {...rest} 
     onChange={this.handleChange} 
     style={this.state.placeholder ? [style, placeholderStyle] : style} 
     /> 
    } 
} 

उपयोग:

<TextInput2 
    text={this.state.myText} 
    style={{ fontFamily: "MyFont" }} 
    placeholderStyle={{ fontFamily: "AnotherFont", borderColor: 'red' }} 
/> 

Answer 2

आप इस कार्यक्षमता को स्वयं बना सकते हैं। जब इनपुट खाली है प्लेसहोल्डर, प्रदर्शित किया जाता है, ताकि आप अपने राज्य की जाँच करें और fontStyle तदनुसार बदल सकते हैं:

<TextInput onChange={txt => this.setState({enteredText: txt})} 
    fontStyle={this.state.enteredText.length == 0 ? 'italic' : 'normal'} 
    style={style.input} /> 

किसी कारण यह FontFamily = सिस्टम के साथ काम करने के लिए प्रतीत नहीं होता है। तो आपको फ़ॉन्ट को स्पष्ट रूप से निर्दिष्ट करना होगा।

Answer 3

सामग्री और TextInput के प्लेसहोल्डर, एक आम शैली उपयोग करती हैं इसलिए आप प्लेसहोल्डर के लिए fontWeight और FONTSIZE सेट कर सकते हैं। दूसरे के लिए, आप TextInput