ReactJS + Redux:如何使用Material-UI的RaisedButton作为<input />?

乔高

我想使用Material-UI的RaisedButton(http://www.material-ui.com/#/components/raised-button),<input/>因此尝试了以下操作:

      <RaisedButton
        containerElement={<input type="file" onChange={this._handleImageChange}/>}
        label="Upload Image"
        labelColor='#88898C'
        labelStyle={{textTransform:'intial'}}
        backgroundColor='#1C1C1F'
      />

但我得到一个错误Invariant Violation: input is a void element tag and must not have "children" or use "props.dangerouslySetInnerHTML". Check the render method

有办法吗?我希望RaisedButton像<input type="file" onChange={this._handleImageChange}/>

先感谢您!

查迪

“ containerElement”的值将是包含您的按钮的元素(换句话说,按钮的父级或包装器)。HTML输入不允​​许包含任何其他元素,因此会出现错误。

将您输入的内容作为按钮的子项:

<RaisedButton label="Upload Image"
              labelColor='#88898C'
              labelStyle={{textTransform:'intial'}}
              backgroundColor='#1C1C1F'>
  <input type="file" onChange={this._handleImageChange}/>
</RaisedButton>

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

ReactJS + Redux-Material-UI:如何使<Toolbar />浮动?

ReactJS Material UI 如何使用 DatePicker、LocalizationProvider、AdapterDateFns

如何在ReactJS Material UI中使用useStyle?

如何通过Webpack的外部使用CDN导入ReactJS Material UI?

如何使用Redux表示Material UI Drawer?

ReactJS material-ui 使用类 `Mui-disabled` 作为只读组件

如何在Material-UI中使用framer-motion?(reactjs)(@ material-ui / core)(成帧器运动)

如何在reactjs中使用material-ui仅显示登录页面?

如何在Reactjs Material UI上使用CSS @media与makeStyles进行响应?

如何使用ReactJS通过Material UI对话框提交表单

如何使用Material ui reactjs禁用今天起的过去日期?

具有Reactjs的Material-UI:如何使用或实现面包屑

使用 Material-ui 时如何保持在 ReactJS 中选择标签?

使用ReactJS在Material-UI AppBar中将标签水平居中

使用reactjs和Material UI单击按钮时更改内容

Material UI Chip数组如何像Angular Chip Input那样使用?

如何将Material-UI TextField与react-phone-number-input一起使用

如何使用组件内的 Material UI 在 CSS 中定位 input type=radio 元素?

ReactJS Material UI组件CSS类,澄清

使Material-UI reactjs FloatingActionButton浮动

Material-UI,Reactjs中的表单

ReactJS水平对齐Material-UI元素

Reactjs 和 Material UI 上的悬停功能

Reactjs 和 Material UI 的路由问题

数据更改时如何刷新ReactJS中的Material-Table(Material-ui)组件

无法自定义material-ui RaisedButton的颜色

Material UI 的 RaisedButton 导致“元素类型无效错误”

如何在ReactJs中使用状态作为检查属性?

如何在 Reactjs 中使用任意目录作为静态目录