文章/答案/技术大牛

发布

社区首页 >问答首页 >如何使用es6语法导入ReactCSSTransitionGroup？

问如何使用es6语法导入ReactCSSTransitionGroup？
EN

Stack Overflow用户

提问于 2016-06-23 14:53:45

回答 1查看 799关注 0票数 2

我正在尝试为我的React应用程序创建模态窗口，并且我正在学习this教程。

但是，我得到了以下错误

Warning: React.createElement: type should not be null, undefined, boolean, or number. It should be a string (for DOM elements) or a ReactClass (for composite components). Check the render method of `Modal`.

以下是我的代码

import React from 'react'
import {ReactCSSTransitionGroup} from 'react-addons-css-transition-group'

const Modal = React.createClass ({

    render() {

        if (this.props.isOpen) {
            return (
                <ReactCSSTransitionGroup transitionName={this.props.transitionName}>
                    <div className="modal">
                        {this.props.children}
                    </div>
                </ReactCSSTransitionGroup>
            )    
        }

        else {
            return (
                <ReactCSSTransitionGroup transitionName={this.props.transitionName} />
            )
        }
    }
})

module.exports = Modal

我安装了react-addons-css-transition-group by npm install --save react-addons-css-transition-group

问题很明显是ReactCSSTransitionGroup没有正确导入，因为用普通的div替换它不会抛出任何错误。

reactjs

reactcsstransitiongroup

javascript

html

css

回答 1

Stack Overflow用户

发布于 2016-06-23 15:08:42

您必须从{ReactCSSTransitionGroup}中删除大括号

import {ReactCSSTransitionGroup} from 'react-addons-css-transition-group'

应该是

import ReactCSSTransitionGroup from 'react-addons-css-transition-group'

此外，您还应该为ReactCSSTransitionGroup中的子项提供密钥

<ReactCSSTransitionGroup transitionName={this.props.transitionName}>
                    <div className="modal" key="transitionGroup">
                        {this.props.children}
                    </div>
</ReactCSSTransitionGroup>

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/37984248

复制

相似问题

问如何使用es6语法导入ReactCSSTransitionGroup？
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何使用es6语法导入ReactCSSTransitionGroup？EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何使用es6语法导入ReactCSSTransitionGroup？
EN