vue3数据更新了,视图不更新
admin
2024-03-10 05:11:59

前言

	最近很多同学遇到数据更新了视图不更新的问题 、接下来我们就一起去分析一下原因,不保证100%能解决你的问题,但也一定能让你有所收获
利用改变key的方式去刷新
不管是react还是vue,在渲染过程中 其实就是一个虚拟的dom树,每个节点的key是唯一的,当这个key改变以后,对应的dom会重新渲染
我们使用的标签容器或者组件子组件,我们没有给他key的时候,react、vue会用自己的算法给他生成特有的key

利用改变key的方式去刷新的关键点:
比如你在div里{{某个响应式的变量}},但是你发现这数据都改变了,页面怎么没有渲染出来呢,多半情况 给div加:key就可以解决,这key需要和你要显示的变量又关系,比如变量改变的时候就要改变key

reactive和ref的使用
都说vue3是沿用react的hooks写法,在react中使用hooks都必须在顶部,不能再函数内部使用,在vue3中却没有这个限制,
虽然写法上没有报错,但是却有时候会出现视图不更新的问题,后来我尝试在vue3中定义变量的时候也放在外面
,不要写在某个函数里,在函数里就正常赋值就行了,这样就解决了视图不更新的问题

相关内容

热门资讯

湖南的辣与江西的辣 在《“孪生兄弟”——湖南与江西?》一文中,我们一同“触摸”并感受了两地相似的山川脉络、江河湖泊与亭台...
这趟恩施之旅,见证了热情淳朴的... 恩施这片神奇的土地,用短短五天时间就在我心里刻下了无法磨灭的印记。那些云雾缭绕的山峰、清澈见底的溪流...
原创 湘... “桂林山水甲天下,阳朔山水甲桂林”一说,增加了我们到阳朔去的迫切期待。26日下午,我们终于坐上了从桂...
走起!去太行一号旅游公路五台山... 作图:宫可欣来源:五台山管委会
巡湘记荣登2025第九届中华餐... 2025年11月13日,上海新国际博览中心见证了餐饮界的一场盛会——“2025第22届中华餐饮双创论...