问一个关于vue会重复渲染的问题

baidu_41881110 2018-12-17 03:41:15

在首页中有若干个子页面查看信息，进入第一个页面查看没问题

返回首页后查看其它页面渲染就出问题了

在其他页面甚至出现了重叠的现象

...全文

1027 回复打赏收藏转发到动态举报

写回复

回复

切换为时间正序

请发表友善的回复…

发表回复

最初我是直接获取这个数据（data）然后直接传递给组件MyComponent，这样会导致组件发生渲染，然后最开始的组件也会重复渲染，导致数据丢失。这部分代码是我自己定义的store模块存储数据，页面的MsgList中的数据就是一条条记录的数据。然后使用这个数组中存储的数据这样，循环中每个组件都有自己的数据渲染，就不会造成影响了。解决办法：存储每次渲染的数据并且存储到最外层的循环中。

在Vue3中，当我们需要渲染一个数组中的数据到dom元素上时，就需要使用循环渲染。循环渲染可以节约我们大量重复冗余的工作，比如我们去渲染一个下拉菜单的时候，如果不使用循环渲染，那么我们需要手动一项一项的添加下拉菜单里面的内容，当下拉菜单中的内容比较少的时候我们还可以接受，但是当下拉菜单中的内容达到几百条的时候，我们就得一遍又一遍的添加选项，非常麻烦。但是使用循环渲染可以很好的结局这个问题，首先我们可以把要渲染的数据放到一个数组里面，再使用vue3提供的关键字v-for进行渲染

vue共享组件不会重复渲染问题

排查 Vue 项目中的内容重复渲染问题需要系统地检查各个部分的代码。通过重点排查上述目录，我们可以更有针对性地找到问题的根源，并采取相应的措施进行修复。在开发过程中，我们应该保持良好的代码结构和规范，避免出现类似的问题，以提高项目的质量和用户体验。

通过上述多层级优化策略的组合应用，可使 Vue3 应用在复杂场景下仍保持流畅的渲染性能。建议通过性能分析工具准确定位瓶颈，避免过早优化。对于关键路径的优化，建议配合基准测试验证优化效果。

87,993

社区成员

224,694

社区内容

发帖

与我相关

我的任务

社区管理员

加入社区

近7日
近30日
至今

加载中

查看更多榜单

社区公告

暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章