vue.js实例中data属性的三种写法及区别
发布时间:2020-08-28 21:51:15 来源: 点击:
data属性的三种写法
1、
2、
3、
第3种是第2种的ES6写法
区别
1)在简单的Vue实例中,没什么区别,因为你app对象不会被复用。
2)但是在组件中,因为可能在多处调用同一组件,所以为了不让多处的组件共享同一data对象,只能返回函数。
1、
- <script type="text/javascript">
- var app=new Vue({
- el:'#app',
- data:{
- isLogin: false
- }
- })
- </script>
2、
- <script type="text/javascript">
- var app=new Vue({
- el:'#app',
- data: function(){
- return {
- isLogin: false
- }
- }
- })
- </script>
3、
- <script type="text/javascript">
- var app=new Vue({
- el:'#app',
- data() {
- return {
- isLogin: false
- }
- }
- })
- </script>
第3种是第2种的ES6写法
区别
1)在简单的Vue实例中,没什么区别,因为你app对象不会被复用。
- var app = new Vue({...})
2)但是在组件中,因为可能在多处调用同一组件,所以为了不让多处的组件共享同一data对象,只能返回函数。
- export default{
- data(){
- return {
- ...
- }
- }
- }
精彩推荐相关内容
- (2020-08-28)vue.js实例中data属性的三种写法及区别
- (2020-08-28)Vuejs中关于computed、methods、watch,mounted的区别
- (2020-09-05)vue中 关于$emit的用法
- (2020-08-28)Vue 之 new vue({})与export default {} 的区别
- (2019-03-11)npm——安装教程、安装vue脚手架
- (2019-03-11)git bash 运行node提示 node: command not found
- (2019-03-11)win10下安装部署vuejs的webpack脚手架工具
相关栏目
热门文章
最新图文
-
Vuejs中关于computed、methods、watch,mounted的区别
- Time:2020-08-28
-
Vue 之 new vue({})与export default {} 的区别
- Time:2020-08-28
-
- Time:2019-03-11
-
git bash 运行node提示 node: command not found
- Time:2019-03-11
-
- Time:2019-03-11
评论排行
- (5)条phpcms筛选功能(经典无错)
- (4)条朋友圈转“贩卖儿童判死”
- (4)条微信即将封杀分销平台?传30
- (3)条做优化,十个最让用户反感的
- (2)条phpcms v9字段筛选教程
- (2)条【织梦bug】织梦5.7进入后台
- (2)条phpcms v9通用api开发教程
- (1)条网页制作技巧教程:网页无障
- (1)条贪吃的阿里:阿里2年疯狂并
- (1)条史上最全SEO高级搜索命令大全