कैसे TextInput प्लेसहोल्डर के लिए फ़ॉन्ट परिवार को बदलें में प्रतिक्रिया मूल निवासी

Question

मैं textInput के प्लेसहोल्डर पाठ के लिए फ़ॉन्ट परिवार बदलना होगा। अगर हम यह secureTextEntry={true} जोड़ते हैं, तो निर्दिष्ट फ़ॉन्ट परिवार प्लेसहोल्डर टेक्स्ट के लिए सेट है।

<TextInput style={styles.textboxfield} secureTextEntry={true} placeholder="Password" /> 

लेकिन अगर हम इस secureTextEntry={true} निकालने के लिए, हम प्लेसहोल्डर

<TextInput style={styles.textboxfield} placeholder="Password" /> 

के लिए font-family निर्धारित नहीं कर सकते शैली है: textboxfieldd: { ऊंचाई: 39, पृष्ठभूमि रंग: '#ffffff', marginBottom: 0, FontFamily: 'Inconsolata-नियमित', },

मैं प्लेसहोल्डर पाठ के लिए फ़ॉन्ट परिवार को कैसे बदल सकते हैं?

Answer 1

इस प्रयास करें:?

<TextInput 
    secureTextEntry={(this.state.email.length <= 0 && this.state.emailStatus != 'onFocus') ? true : false} 
    style={styles.textboxfieldd} 
    placeholderStyle={styles.textboxfieldd} 
    onFocus={this.changeStatus.bind(this, 'emailStatus', 'onFocus', '')} 
    onChangeText={(email) => this.setState({ email })} 
    value={this.state.email} 
    placeholder={this.state.emailStatusPH} 
    placeholderTextColor="#D8D8D8" /> 

वास्तव में इस लाइन => secureTextEntry = {(! This.state.email.length < = 0 & & this.state.emailStatus = 'onFocus') सच : झूठी} समस्या हल करती है।

क्योंकि अगर हम दे secureTextEntry = {सच} का आशय FontFamily पाठ प्लेसहोल्डर के लिए निर्धारित है, लेकिन क्षेत्र, पासवर्ड के रूप में बदल दिया है तो के लिए है कि केवल हम इस तरह लिखा था। secureTextEntry = {(this.state.email.length < = 0 & & this.state.emailStatus = 'onFocus'!) सच: झूठी}

हैं कि क्षेत्र लंबाई 0 और नहीं ध्यान केंद्रित यह सच सेट हो जाएगा मतलब है secureTextEntry = {सच} तो FontFamily

Answer 2

आप एक बार फॉन्ट बदलना चाहते हैं, तो आप सिर्फ fontFamily: yourFontFamilyName

आप कई जगह में अपने फ़ॉन्ट के प्रयोग पर योजना बना रहे हैं निर्धारित कर सकते हैं मैं तुम्हें एक वर्ग है कि एक ही FontFamily हर का उपयोग करेगा बनाने की सलाह:

आप इसे इस तरह से कर सकते हैं: (font-family के रूप में Quicksand साथ उदाहरण)

import React, {TextInput} from 'react-native'; 

import _ from 'lodash'; 

var OldTextInput = TextInput; 

class NewTextInput extends OldTextInput { 
    defaultProps = {}; 
    render() { 
    var props = _.clone(this.props); 

    if (_.isArray(this.props.style)){ 
     props.style.push({fontFamily: 'Quicksand-Regular'}); 
    } else if (props.style) { 
     props.style = [props.style, {fontFamily: 'Quicksand-Regular'}]; 
    } else { 
     props.style = {fontFamily: 'Quicksand-Regular'}; 
    } 

    this.props = props; 

    return super.render(); 
    }; 
} 

export default NewTextInput; 

और उसके बाद हर फाइल में यह आवश्यक बनाकर TextInput का उपयोग करें (import TextInput from './TextInput')