©
This document uses PHP Chinese website manual Release
输入
import ShallowRenderer from 'react-test-renderer/shallow';
// ES6var ShallowRenderer = require('react-test-renderer/shallow');
// ES5 with npm在为React编写单元测试时，浅层渲染可能会有所帮助。浅层渲染使您可以渲染“一层深度”的组件，并确定其渲染方法返回的事实，而不必担心未实例化或渲染的子组件的行为。这不需要DOM。
例如，如果您有以下组件：
function MyComponent() { return ( <div> <span className="heading">Title</span> <Subcomponent foo="bar" /> </div> );}然后你可以断言：
import ShallowRenderer from 'react-test-renderer/shallow';// in your test:const renderer = new ShallowRenderer();renderer.render(<MyComponent />);const result = renderer.getRenderOutput();expect(result.type).toBe('div');expect(result.props.children).toEqual([ <span className="heading">Title</span>, <Subcomponent foo="bar" />]);浅测试目前有一些限制，即不支持参考。
注意：我们也推荐检查酶的浅显示API。它通过相同的功能提供更好的更高级别的API。
shallowRenderer.render()您可以将shallowRenderer视为渲染正在测试的组件的“地点”，并从中提取组件的输出。
shallowRenderer.render()是类似的，ReactDOM.render()但它不需要DOM，只能渲染一个深度。这意味着您可以测试与孩子实施方式相关的组件。
shallowRenderer.getRenderOutput()在shallowRenderer.render()调用之后，可以使用shallowRenderer.getRenderOutput()获取浅显示的输出。
然后你可以开始断言输出结果。