gpt4 book ai didi

reactjs - 开 Jest : react-router tests returns undefined 'params'

转载 作者:行者123 更新时间:2023-12-03 13:34:25 32 4
gpt4 key购买 nike

我正在尝试使用 MemoryRouter 测试组件,如 React-router 文档中所示,并设置初始条目,以便我可以在包装的组件中包含参数。

组件示例:

render () {
console.log(this.props.match.params.item)
}

在应用程序中(工作正常):

<Router>
<Switch>
<Route exact path='/' render={() => (
<Redirect to={`/${guessLocale()}`} />
)} />
<Route exact path='/:lang' component={Home} />
<Route exact path='/:lang/:itemName' component={Vidactic} />
</Switch>
</Router>

在测试中(从 Enzyme 安装,匹配未定义):

mount(<MemoryRouter initialEntries={['/fr/pamp']}>
<Vidactic />
</MemoryRouter>)

所以我使用了这个解决方法,但为什么initialEntries 不能单独工作?

mount(<MemoryRouter initialEntries={['/fr/pamp']}>
<Vidactic match={{ params: { item: 'pamp' } }} />
</MemoryRouter>)

最佳答案

没有Route在您的测试中,因此不会发生匹配,并且 this.props.match对于 Vidactic 将是未定义的。添加路线应该可以使其工作:

mount(
<MemoryRouter initialEntries={['/fr/pamp']}>
<Route exact path="/:lang/:itemName" component={Vidactic} />
</MemoryRouter>
);

为了避免重复路由,您可能需要将 <Switch>..</Switch>组成一个单独的组件并在测试中使用它。

关于reactjs - 开 Jest : react-router tests returns undefined 'params' ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51156805/

32 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com