javascript – Reactjs:TypeError:无法读取undefined的属性’propTypes’

请我为下面的reactjs页面一个unitTest.
export default class Collapsible extends React.Component {
    static propTypes = {
        title: React.PropTypes.string,children: React.PropTypes.any,};

    render() {
        const { title } = this.props;
        return (
            <details>
                <summary>{title}</summary>
                {this.props.children}
            </details>
        );
    }
}

继0730之后,我在下面写了我的测试

describe('Collapsible',()=>{
    it('works',()=>{
        let renderer = createRenderer();
        renderer.render(<Collapsible title="MyTitle"><span>HEllo</span></Collapsible>);
        let actualElement = renderer.getRenderOutput();
        let expectedElement = (<details><summary>title</summary>Details</details>);
        expect(actualElement).toEqual(expectedElement);                     
    });
});

但是,我的测试是在上面的标题中抛出错误,我怀疑我在Collapsible上的道具(即标题和孩子)没有从测试中分配.请问我该如何解决这个问题?非常感谢任何帮助或指导.

解决方法

谢谢你的时间.事实证明我错误地将Collapsible导入测试文件.以下是我之前的导入方式
import React from 'react';
import expect from 'expect';
import {createRenderer} from 'react-addons-test-utils';
import { Collapsible }  from '../Collapsible.js';

改为之后

import React from 'react';
import expect from 'expect';
import {createRenderer} from 'react-addons-test-utils';
import Collapsible  from '../Collapsible';

它似乎工作.我以前导入Collapsible作为现有的变量/对象.通过阅读文档和很少的教程,我意识到.

相关文章

前言 做过web项目开发的人对layer弹层组件肯定不陌生,作为l...
前言 前端表单校验是过滤无效数据、假数据、有毒数据的第一步...
前言 图片上传是web项目常见的需求,我基于之前的博客的代码...
前言 导出Excel文件这个功能,通常都是在后端实现返回前端一...
前言 众所周知,js是单线程的,从上往下,从左往右依次执行,...
前言 项目开发中,我们可能会碰到这样的需求:select标签,禁...