javascript - 如何在 Radium 中包装 react redux connect?

标签 javascript reactjs ecmascript-6 redux radium

通常当我在我的 React 应用程序中使用 Radium 时,我会简单地将我导出的类包装在 Radium 中

export default Radium(App)

和媒体查询将按预期工作。但是,我想同时使用来自 react-router 的连接和 Radium,如下所示:

//Imports
import React from 'react'
import Radium from 'radium'
import { Table, TableBody } from 'material-ui/Table'
import { connect } from 'react-redux

const tableWrapper = {
    width: '100%',
    '@media screen and (max-width: 799px)': {
        width: '50%'
    }
}

render() {
    <Table wrapperStyle={tableWrapper}>
        <TableBody>
           ...
        </TableBody>            
    </Table>
}

function mapDispatchToProps(dispatch) {
    return bindActionCreators(Object.assign({}, {update}), dispatch)
}

export default connect(null, mapDispatchToProps)(Radium(App))
export { App as AppNoRadium }

但是当我应用我的样式时,我继续收到警告/错误:

Warning: Unsupported style property @media screen and (max-width: 799px). Did you mean @media screen and (maxWidth: 799px)?

我是否错误地将我的组件包裹在 Radium 中?

最佳答案

怎么最后又导出文件了。使用以下

Login = connect(mapStateToProps, { })(Radium(Login)); 导出默认登录;

这会很好用。不要忘记在顶部导入镭 :)

关于javascript - 如何在 Radium 中包装 react redux connect?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42494093/

相关文章:

javascript - 将 WebGL 非连续线渲染为单个对象

javascript - 带条件的开关盒

javascript - 将可拖动点绑定(bind)在一起

javascript - 过滤 redux 状态时收到错误消息

javascript - 合并按日期排序的对象数组

javascript - es6扩展已经定义的类

java - 是否可以将多个位图图像堆叠在一起?

css - Material -ui-next : Setting image size to fit a container

javascript - 仅在 Tab 键时显示焦点轮廓,而不是在单击鼠标时显示焦点轮廓

javascript - 将 Promise 返回给没有 $$state 的变量