secureTextEntry 正在改变字体系列 React Native

Question

我正在构建一个登录表单，其中包含使用 TextInput 组件的 React Native 的用户名和密码字段，对于密码字段，我正在传递 secureTextEntry 属性如下：

<TextInput
value={password}    
onChangeText={(e)=>setPassword(e)}
style={styles.password}
secureTextEntry={true}

但是我遇到了一个问题，即 fontFamily 样式没有应用到具有 secureTextEntry 属性的 TextInput 上。通过编写以下内容，我想出了一个仅适用于 IOS 但不适用于 Android 的解决方案：

为密码文本输入添加了ref={ref => ref_1 = ref}属性，因此它变成如下：

  <TextInput
    value={password}    
    onChangeText={(e)=>setPassword(e)}
    style={styles.password}
    secureTextEntry={true} 
    ref={ref => ref_1 = ref}

尝试在 useEffect 上设置样式

let ref_1 =  useRef(null)
  useEffect(()=>{

    ref_1.setNativeProps({
        style:{
          fontFamily:fonts.dinRegular
        }
    })
  
  },[])

但现在我有一个错误，整个占位符在 ANDROID 上完全消失，但在 IOS 上运行完美...

还有其他建议吗？

Answer 1

试试这个方法

ref_1.current.setNativeProps({
        style:{
          fontFamily:fonts.dinRegular
        }
})

Answer 2

根据this issue

只需更新 Expo 即可解决问题！[=11=]

Answer 3

以下对我有用。

const inputRef = useRef();

useEffect(() => {
    if(inputRef && inputRef.current){
      inputRef.current.setNativeProps({ style: {fontFamily: 'YOUR-FONT-FAMILY'} })
    }    
}, [inputRef.current]);



<TextInput ref={inputRef} />

secureTextEntry 正在改变字体系列 React Native

secureTextEntry is changing font family React Native

react-native

expo

react-native-android

react-native-ios