Question

我要设置暗模式和亮模式，在暗模式下我希望占位符文本颜色为白色，在亮模式下我希望它为暗。为了实现这一点，我尝试在占位符文本颜色本身中使用if / else，也尝试使用下面代码中所示的函数来实现。

我使用react-native的Switch返回true或false。在true时执行语句中的第一种样式，在false时执行语句中的第二种样式。这些占位符文本颜色位于texinput中。

// First try
const toggle = this.state.switchValue;
<TextInput
 style={textInput}
 onChangeText={(password) => this.setState({password})}
 placeholder={'Password'}
 placeholderTextColor={toggle === true ? styles.darkColor : styles.whiteColor}
 value={this.state.password}
/>

// Second try by doing it through a function
test = () => {
    return toggle === true ? styles.darkColor : styles.whiteColor
};
<TextIn...
placeholderTextColor={() => this.test()}
/>

// Third try. From the statement above I get an object, so I get the color (string ("#444")). But still get same error.
placeholderTextColor={toggle === true ? JSON.stringify(styles.darkColor.color) : JSON.stringify(styles.whiteColor.color)}

我希望占位符根据开关的状态更改颜色。但是我得到的只是错误。警告：道具类型失败：警告：道具类型失败：提供给placeholderTextColor：函数的道具和无效道具TextInput。有什么办法可以做到这一点？

Answer 1

根据TextInput的documentation，“ placeholderTextColor”应接受“ color”属性，并且您正在使用style。

尝试一下

const toggle = this.state.switchValue;
<TextInput
 style={textInput}
 onChangeText={(password) => this.setState({password})}
 placeholder={'Password'}
 placeholderTextColor={toggle === true ? "black" : "white"}
 value={this.state.password}
/>

如何在textinput中切换占位符textcolor值？

1 个答案: