[英]Prevent re-render with every URI for React Router params
Given the following route, if a URI query is added or changed (ie ?bar2=foo
) then MySpecialComponent
will rerender even though it isn't set to capture these params: 给定以下路线,如果添加或更改了URI查询(即
?bar2=foo
),则MySpecialComponent
将重新呈现,即使未将其设置为捕获这些参数也是如此:
<Route exact path="/foo/:bar" render={props => (<MySpecialComponent/>)}/>
This causes a massive amount of re-rendering when used throughout. 当整个使用时,这会导致大量的重新渲染。 How can the unwanted params be ignored?
如何忽略不必要的参数? Ie to not triggering a re-render until the bit we care about changes (
/foo/:bar
). 也就是说,直到我们关心更改(
/foo/:bar
)之前,才触发重新渲染。
I found using render
on route
along with passing the params myself to be the cleanest solution (to not pollute containers with router logic): 我发现在
route
上使用render
以及自己传递参数是最干净的解决方案(不使用路由器逻辑污染容器):
<Route exact path="/foo/:bar" render={props => (
// Only pass needed props to avoid unnecessary re-render on ANY URI change
<MySpecialComponent bar={props.match.params.bar}/>
)}/>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.