Vue实现手动刷新组件的方法 - 行业资讯 - 肥雀云

开发过程遇到了一个问题,就是我的router-view里面渲染出来的组件输入数据之后,我点击路由视图外边的导航栏router-link按钮,可以实现清除router-view里面的数据,也就是使组件重新渲染. vm。美元forceUpdate()这个方法可以使当前组件调用这个方法时,重新渲染组件。给router-view标签添加关键属性将钥匙绑定的值放在状态管理容器里面,通过状态管理容器的突变或者的行为触发关键值的变化,即可实现重新渲染组件的目的。相关实现代码如下
　　

　　　　//存储/view.js 　　const状态={ 　　viewId: 1 　　}; 　　const getter={ 　　getViewId:状态=比;{ 　　返回state.viewId; 　　} 　　}; 　　const突变={ 　　setViewId:(状态,有效载荷)=比;{ 　　state.viewId + +; 　　} 　　}; 　　const行动={ 　　setViewId:(背景下,载荷)=比;{ 　　context.commit (“setViewId”,有效载荷); 　　} 　　}; 　　出口默认{ 　　名称空间:没错, 　　状态, 　　getter方法, 　　突变, 　　行动　　}; 　　之前　　　　

放置router-view标签的布局组件

Vue实现手动刷新组件的方法”> 
　　
　　触发viewid,使router-view对应的路由组件刷新的地方,比如导航栏组件。 
　　
　　
　　<pre类= 　　方法:{ 　　新(){ 　　store.dispatch美元。(“视图/setViewId”) 　　} 　　}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。