vm。$ set和Vue.set有什么区别?

编程入门 行业动态 更新时间:2024-10-26 05:33:14
本文介绍了vm。$ set和Vue.set有什么区别?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧! 问题描述

我仔细阅读并重新阅读了Vue文档反应深度 和 vm。$ set 和 Vue.set 但我仍然很难确定何时使用哪个。我能够区分这两者是很重要的,因为在我目前的Laravel项目中,我们动态地在对象上设置了很多属性。

I have carefully read and re-read the Vue docs "Reactivity in Depth" and the API for vm.$set and Vue.set but I am still having a difficult time determining when to use which. It is important for me to be able to distinguish between the two because in my current Laravel project, we are setting a lot of properties on objects dynamically.

文档中的区别似乎是vm。$ set为For Vue instance而Vue.set为For plain data objects的语言之间的区别Vue.set是全局的:

The distinction in the docs seems to be between the language that vm.$set is "For Vue instance" while Vue.set is "For plain data objects" and that Vue.set is global:

然而,有一些方法可以添加一个属性并在之后使其成为一个实例已创建。

However, there are ways to add a property and make it reactive after an instance has been created.

对于Vue实例,您可以使用$ set(路径,值)实例方法:

For Vue instances, you can use the $set(path, value) instance method:

vm.$set('b', 2) // `vm.b` and `data.b` are now reactive

对于普通数据对象,可以使用全局Vue.set(对象, key, value)方法:

For plain data objects, you can use the global Vue.set(object, key, value) method:

Vue.set(data, 'c', 3) // `vm.c` and `data.c` are now reactive

最后,我想知道上面做的第三个选项(用于一次添加多个属性)是否可以用作任何一个的等效替代上面的2个选项(只添加1个属性而不是多个)?

Finally, I was wondering if the 3rd "option" of doing the above (which is for adding multiple properties at one time) could be used as an equivalent substitute for either of the 2 options above (by adding just 1 property instead of multiple)?

有时您可能希望将一些属性分配给现有对象,例如使用Object.assign()或_.extend()。 但是,添加到对象的新属性不会触发更改。 在这种情况下,使用原始对象和mixin对象的属性创建一个新对象:

Sometimes you may want to assign a number of properties on to an existing object, for example using Object.assign() or _.extend(). However, new properties added to the object will not trigger changes. In such cases, create a fresh object with properties from both the original object and the mixin object:

// instead of `Object.assign(this.someObject, { a: 1, b: 2 })` this.someObject = Object.assign({}, this.someObject, { a: 1, b: 2 })

推荐答案

<这是发布Vue.set的发行说明:

Here is the release note that went with the introduction of Vue.set:

Vue不再使用$ set扩展Object.prototype $ delete方法。 这导致了在某些条件检查中依赖这些属性的库的问题(例如Meteor中的minimongo)。 而不是object。$ set(key,value)和object。$ delete(key),使用新的全局方法Vue.set(object,key,value)和Vue.delete(object, key)。

Vue no longer extends Object.prototype with $set and $delete methods. This has been causing issues with libraries that rely on these properties in certain condition checks (e.g. minimongo in Meteor). Instead of object.$set(key, value) and object.$delete(key), use the new global methods Vue.set(object, key, value) and Vue.delete(object, key).

所以,。$ set 用于可以在所有对象上使用 - 它现在仅在View Model本身上可用。因此,当您引用被动对象但没有对其所属的视图模型的引用时, Vue.set 就会在这些情况下使用。

So, .$set used to be available on all objects - it is now only available on a View Model itself. Vue.set is therefore used in those cases now when you have a reference to a reactive object but do not have a reference to the View Model it belongs to.

更多推荐

vm。$ set和Vue.set有什么区别?

本文发布于:2023-10-29 02:53:59,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/34/1538521.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:有什么区别   vm   set   Vue

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!