vue实现不刷新整个页面刷新数据

vue实现不刷新整个页面刷新数据,第1张

vue实现无刷新加载数据,使用的技术是依赖注入 关键字为provide inject

在App.vue中

然后在需要使用这个方法的的vue组件中注入这个方法

我想,你应该通过isread来设定消息显示的。比如说isread=1,那么显示代表已读,isread=0,那么显示代表未读。

那么点击时,不更新数据库,只设定显示。即点击消息后,直接在页面将未读改成已读。在其他时候再根据这个标志更新数据(比如离开页面时。手动刷新时)。

最近在开发中遇到了这样一些情况,通过点击事件改变了对象里面得数据,但是页面却不刷新,后来发现,是在给对象添加属性时出现的问题。

当vue的data里边声明或者已经赋值过的对象或者数组(数组里边的值是对象)时,向对象中添加新的属性,如果更新此属性的值,是不会更新视图的。

当页面初始化时候,vue会遍历data对象所有的属性,并使用object.defineProperty把这些属性全部转化为getter/setter,所以属性必须在 data 对象上存在才能让 Vue 转换它,这样才能让它是响应的。

官方定义:

Vue 不允许在已经创建的实例上动态添加新的根级响应式属性 (root-level reactive property)。

解决方法:可以使用 Vue.set(object, key, value) 方法将响应属性添加到嵌套的对象上:

也可以使用 this.$forceUpdate() 方法,可以局部更新

迫使Vue实例重新渲染。它仅仅影响实例本身和插入插槽的子组件,而不是所有字组件


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/sjk/6706518.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-03-27
下一篇 2023-03-27

发表评论

登录后才能评论

评论列表(0条)

保存