css - Style Redux Form 'Field' 标签

标签 css reactjs material-ui redux-form

我需要对 Redux 表单字段的标签应用一些样式。 Redux Form API 没有提到任何方式来设置标签的样式。 classes.formField 类被应用到字段本身而不是标签。

这也可能是一个关于强制继承的问题,因为在这种情况下,标签没有继承父级的样式。

import { Field } from 'redux-form'
import TextField from 'redux-form-material-ui/lib/TextField'

  <Field
    className={classes.formField}
    component={TextField}
    label={'style me!!'}
    fullWidth
    name="answer"
    required
    type="text"
    validate={[required]}
  />

最佳答案

添加您自己的 <CustomLabel />标签 Prop 的组件。

<Field
    className={classes.formField}
    component={TextField}
    label={<CustomLabel/>}
    fullWidth
    name="answer"
    required
    type="text"
    validate={[required]}

  />

制作自定义标签组件并传递给它

const CustomLabel = () => {
 var labelStyle = {
      color: 'white',
    };
return <label style={labelStyle}> Im the custom label with css </label>
}

In React, inline styles are not specified as a string. Instead they are specified with an object whose key is the camelCased version of the style name, and whose value is the style's value, usually a string.

关于css - Style Redux Form 'Field' 标签,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49392535/

相关文章:

css - 使用 matrix3d 在悬停时获得垂直立方体旋转

javascript - 如何在不使用 <MuiThemeProvider/> 的情况下更改 Material-UI TextField 底部颜色

reactjs - 更新到material-ui@0.15.0-beta.1后我无法使用material-ui组件

javascript - 在 Material ui 中使用 useMediaQuery?

javascript - 如何在悬停时顺利地为 Bootstrap 制作动画?

background - 使用 css sprites 作为标题背景的问题

html - 如何使用CSS在网站中添加光标?

javascript - React-Modal "Cannot Read Property of State of Null"错误

javascript - 类型错误: Cannot read properties of undefined (reading 'price' ) - Next. js 14.0.1

javascript - 在 setState 中设置多个状态 - React.js ES6