当前位置: 首页 > Web前端 > vue.js

分页组件之间的渲染问题

时间:2023-04-01 12:06:39 vue.js

目的:实现项目中的效果,页面数据会通过点击次数出现弹窗,弹窗的内容会用一层组件来渲染,等于parent(首页)-child(点击数字出现弹出窗口的外层)-sub(渲染弹出窗口的内容,其中包含分页数据)出现问题:点击后A和出现弹窗,点击弹窗中的页面翻到第二页或第三页等,关闭弹窗点击B再次出现弹窗。此时弹窗中的分页组件还保留着上次第三页或第二页的值,组件没有更新视图分析原因:点击弹窗时,因为分页组件有已经出现了,vue机制不会再更新这个组件的视图,所以需要使用其他方法来触发组件更新解决方法:在分页组件上面添加v-if,让分页组件渲染分页组件更新视图在二级子组件同时触发总结:数据请求太慢,导致视图没有及时响应,发生变化。对于此类问题,可以通过v-if提示组件实时更新,实现视图的更新