以下是我的React组件:
import React from 'react'
var PageLeftLower = React.createClass({
render:function(){
return(<a href="#">Quote Requests</a>);
}
});
module.exports = PageLeftLower;
所以,非常简单的React组件。 我刚开始使用Enzyme和Mocha进行测试,并编写了以下代码。
import expect from 'expect';
import React from 'react';
import {shallow} from 'enzyme';
import {PageLeftLower} from './PageLeftLower';
describe('Component : WholeTab',() => {
it('renders without exploding', () => {
expect(shallow(<PageLeftLower/>).length).toEqual(1);
});
});
执行此操作时,会输出以下警告:
组件: WholeTab警告:React.createElement:type不应为null,undefined,boolean或number。它应该是一个字符串(对于DOM元素)或一个ReactClass(对于复合组件)。
并出现以下错误:
TypeError:无法读取属性&#39; propTypes&#39;未定义的。
非常感谢任何帮助。
答案 0 :(得分:2)
问题在于:
import {PageLeftLower} from './PageLeftLower';
因为您直接导出组件:
module.exports = PageLeftLower;
它不包含在像这样的对象中:
module.exports = {PageLeftLower: PageLeftLower};
因此您的组件可以通过以下方式访问:
import PageLeftLower from './PageLeftLower'; // not {PageLeftLower}