vue改变数据,vue定义数据类型
本文主要介绍如何在Vue中定义数据的相关信息。通过示例代码详细介绍，对大家学习或使用vue有一定的参考价值。有需要的朋友可以参考一下。
前言
在开发过程中，定义变量是一件非常高频和基础的事情。如何根据变量的使用场景和范围合理定义变量，是一件很小很容易出错的事情。
Vue2被广泛使用了这么多年，大多数开发者在开发过程中喜欢在data选项中定义很多变量，不利于代码的可读性、可维护性和性能。想要用好变量，需要结合Vue和JS的特点。
在Vue中，按照是否需要双向数据绑定，可以将变量分为两种：
一个是需要被Vue的数据劫持，实时响应数据的变化来查看。
只要数据的msg只发生变化，模板中绑定的msg就会实时响应。
模板
div{{msg}}/div
/模板
脚本
导出默认值{
data() {
邮件：“”
}
};
/脚本
还有一个不需要被Vue数据劫持的：
只在脚本中生效，不在模板中使用，所以不需要数据劫持。
该名称仅在concatName函数中生效，因此可以将其定义为局部变量。
age函数getAge和concatName是需要使用的，但是如果不适合作为局部变量使用，可以提升它的作用域，方便它在很多地方使用。
脚本
const age=bar
导出默认值{
方法：{
getAge() {
回归年龄
},
concatName() {
let name=nordon
reutrn `姓名：$ {姓名}，年龄：$ {年龄}
}
},
};
/脚本
在模板中只作为渲染数据使用，定制后在后续操作中不会被修改。如果这个数据被Vue劫持，会浪费一些性能。
模板
arr“{ item . name } }/div中的div v-for=item
/模板
脚本
const arr=Object.freeze([{
名称：“诺东”，
年龄：18岁
}])
导出默认值{
data() {
返回{
arrive）
}
}
};
/脚本
使用Object.freeze冻结不需要数据劫持的数据。在Vue中递归遍历数据劫持数据时，不会劫持数据，特别是对于大量的表类，数据性能会有显著提升。
从Vue源代码中可以看出为什么使用Object.freeze处理数据后不会发生数据劫持。
函数definereative(obj，key) {
//删除无关代码，只保留判断条件。
const property=object . getownpropertydescriptor(obj，key)
if(property property . configurable===false){
返回
}
}
总结
这就是这篇关于如何在Vue中定义数据的文章。有关Vue定义数据的更多信息，请搜索我们以前的文章或继续浏览下面的相关文章。希望你以后能支持我们！
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。