react16.3-jest

功能组件和UI组件 react-antd

• 命名

react 规定组件开头都为大写,所以如果react项目如果用antd后，开发者看起来会比较混乱，不太容易区分哪个上功能组件哪个上UI组件，用的时候我们把UI组件命名一下来区分;
antd也规定来UI组件必须以大写字母开头哦～，看下面代码：

import { Card as TplCard } from 'antd'
<TplCard>
</TplCard> // 注意要驼峰式且首字母大写

开始第一个test

• src/index.test.js

describe('index', () => {
  it('index.js has no error', () => {
    document.body.innerHTML = '<div id="root"></div>';
    require('../src/index');
  });
});

• src/index.js

import React, { Component } from 'react';
import ReactDOM from 'react-dom';
class App extends Component {
  render() {
     return(
        <div className="App">
          test
        </div>
      )
  }
}
ReactDOM.render(<App />, document.querySelector('#root'));

• 执行

->~ npm run test

image.png

--待更新...