如何使在vue之外创建的变量具有响应性-mile米乐体育

如何使在vue之外创建的变量具有响应性

这篇文章给大家分享的是有关如何使在vue之外创建的变量具有响应性的内容。小编觉得挺实用的，因此分享给大家做个参考，一起跟随小编过来看看吧。

如果你从vue外部获得一个变量，那么能够使其具有响应性就很好。这样你就可以在计算道具、观察者和其他任何地方使用它，它就像vue中的任何其他状态一样工作。

当你正在使用 options api，你只需将它放在data组件的部分中：

constexternalvariable=getvalue();exportdefault{data(){return{reactivevariable:externalvariable,};}};

当你在vue 3中使用组合api，则可以使用ref或reactive这样：

import{ref}from'vue';//可以完全在vue组件之外完成constexternalvariable=getvalue();constreactivevariable=ref(externalvariable);//使用.value访问console.log(reactivevariable.value);使用reactive来代替：\import{reactive}from'vue';//可以完全在vue组件之外完成constexternalvariable=getvalue();//reactive仅适用于对象和数组constanotherreactivevariable=reactive(externalvariable);//直接访问console.log(anotherreactivevariable);

如果你仍在使用vue 2（就像我们中的许多人一样），你可以使用observable而不是reactive获得完全相同的结果。

感谢各位的阅读！关于“如何使在vue之外创建的变量具有响应性”这篇文章就分享到这里了，希望以上内容可以对大家有一定的帮助，让大家可以学到更多知识，如果觉得文章不错，可以把它分享出去让更多的人看到吧！