材质UI - 设置输入占位符文本的样式



对于一些类似的Material UI问题,我尝试了一些堆栈溢出的答案,但似乎没有一个解决方案适用于我的情况。

我有一个带有占位符文本的输入组件。我想设置占位符文本的大小和字体族的样式。现在我只是通过组件上的inputProps进行内联样式设置。这是我的代码:

<Input
inputProps={{
classes: {
fullWidth: {fontFamily: 'Open Sans', fontSize: 18.9}
}
}}
fullWidth={true}
placeholder="Business Email Address"
onChange={this._onChange}
/>

我知道我在回答一个老问题,但是。。。

另一种选择是使用"&"选择器。

'& ::placeholder': {
//Styles go here...
}

这将直接影响占位符文本。

es6中的样式化组件您可以使用它,使用样式创建常量

//this out side the class
const inputStyle = {
fontFamily: 'Open Sans', 
fontSize: 18.9px
};
<Input
style={inputStyle}
fullWidth={true}
placeholder="Business Email Address"
onChange={this._onChange}
/>

我希望这项工作与你

最新更新