由于最近开始从vue2转vue3,对vue3的很多写法还不太熟悉。
今天使用changing这个变量进行控制组件的显示时,明明打印出changing的值是确实发生了改变的,但是页面中的样式却不发生改变!!
是因为,有个地方非常需要注意,也是刚开始学习vue3的人非常容易犯的一个错误,就是。
在改变ref值时,一定给变量名字加上 .value 进行重新赋值操作!!!
//changing值
//操作按钮
错误写法:
(注意这里是直接changing = true)
点击按钮后可以看到控制台中的确显示changing已经变成true
但是页面样式却没有变化
⬇⬇⬇⬇⬇⬇
正确写法:
(注意这里是changing.value = true)
可以正常响应