如何打印已安装组件的子元素?

Question

我希望能够打印包装器的结果。找到(一些选择器)

我正在安装一个react组件

wrapper = mount(
<SomeReactComponent />
);

我能够用console.log(wrapper.debug())打印包装器的整个内容，但我想知道是否有某种方法可以打印特定的结果。我尝试了console.log(wrapper. log)。Find ('some selector').debug())但是没有打印。

如何打印包装中呈现的html的更具体部分?

Answer 1

既然你正在使用mount方法，我猜你正在使用酶进行渲染。

在这种情况下，您可以使用具有一个参数选择器的简单find。该选择器为常规查询选择器。

const wrapper = mount(<MyComponent />);
console.log(wrapper.find('.my-component').at(0).html())

注意：如果您有更多具有my-component的组件，它将返回元素数组，因此需要有.at(0)来选择一个项目。

html()将打印纯html代码。

API参考:https://enzymejs.github.io/enzyme/docs/api/ReactWrapper/find.html