无法读取未定义的属性“名称”：redux-reactstrap-modal答案

【问题标题】：Cannot read property 'name' of undefined : redux-reactstrap-modal无法读取未定义的属性“名称”：redux-reactstrap-modal
【发布时间】：2019-07-31 08:06:26
【问题描述】：

我正在为我的项目使用redux-reactstrap-modal。当我配置 webpack 和 babel 时，网页上出现以下错误。

这是我的 package.json

"dependencies":{
    "babel": "^6.23.0",
    "babel-core": "^6.26.3",
    "babel-loader": "^8.0.6",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "react": "^16.8.4",
    "react-redux": "^5.0.7",
    "react-scripts": "1.1.1",
    "redux-reactstrap-modal": "^1.0.3",
    "webpack": "^3.11.0"
}

Playmodel.js

    import React, { Component } from 'react';
    import reduxDialog, { closeDialog, openDialog } from 'redux-reactstrap-modal';
    import { connect } from "react-redux";
    import { bindActionCreators } from "redux";
    import { compose } from 'recompose';

    class PlayModal extends Component {

     render() {
            const { data, t } = this.props;
            return (
                <div>
                 ............
                </div>);

       }
    }


    function mapDispatchToProps(dispatch) {
        return bindActionCreators({ closeDialog, openDialog }, dispatch);
    }

export default (reduxDialog({ name: 'MODAL_PLAY',backdrop:'static'}), connect(null, mapDispatchToProps))(PlayModal);

【问题讨论】：

一些代码可能有用
这是我所做的唯一改变。刚刚安装了 babel 和 webpack。然后应用程序告诉我那个错误
你可能需要给模态一个 prop name 这是必需的。对从此包扩展的所有模式执行此操作。 from，从PlayWith组件开始。
@SultanH。它也给出了 export default (reduxDialog({ name: 'MODAL_OTP',backdrop:'static'}), connect(null, mapDispatchToProps))(OTPModal); 。并且在安装 webpack 之前应用程序运行没有任何错误
您能否在答案中包含导出语句的代码，格式正确，并且在您的代码中。

标签： reactjs webpack babeljs

【解决方案1】：

您能否将其视为PlayModal 组件的替代品，更新组件的导出语句：

import React, { Component } from 'react';
import reduxDialog, { closeDialog, openDialog } from 'redux-reactstrap-modal';
import { connect } from "react-redux";
import { bindActionCreators } from "redux";
import { compose } from 'recompose';

class PlayModal extends Component {

 render() {
   return (
     <div>
       {
         /** SOME JSX */
       }
     </div>
   )
 }
}


function mapDispatchToProps(dispatch) {
    return bindActionCreators({ closeDialog, openDialog }, dispatch);
}

const WithDialog = reduxDialog(connect, { name: 'MODAL_PLAY',backdrop:'static'})(PlayModal);
const ConnectedWithDialog = connect(null, mapDispatchToProps)(WithDialog);

export default ConnectedWithDialog;

【讨论】：

我已经更新了答案中的WithDialog声明，因为阅读from，reduxDialog需要connect作为第一个参数，当前声明导致第二个参数settings没被罚款，我们可以试试这个吗？
太棒了！是我描述的还是你找到了其他解决方案？