new Vue({})和var app=new Vue({})两种创建vue实例的区别在哪？

new Vue({})和var app=new Vue({})两种创建vue实例的区别在哪？

1. <div id="app">
   
2. 
   
3.         <p>{{msg}}</p>
   
4. 
   
5.     </div>
   
6. 
   
7.     <script>
   
8. 
   
9.         var app = new Vue({
   
10. 
    
11.             el: '#app',
    
12. 
    
13.             data: {
    
14. 
    
15.                 msg: 'Hello Vue'
    
16. 
    
17.             }
    
18. 
    
19.         })
    
20. 
    
21.         app.msg=123
    
22. 
    
23.         console.log(app.msg)
    
24. 
    
25.         console.log(app.$data.msg === app.msg)
    
26. 
    
27.     </script>

复制代码

上面代码通过var方式创建时两个打印信息正常执行，通过new Vue方式创建时第二个打印信息报错，求前辈指点这两种方式区别在哪？

只是new Vue({})而不var app=new Vue({})赋值给app这个变量的话，app就实际不是一个Vue的实例，它其实直到app.msg=123才被创建，不具有$data属性


el:"#app"意思是挂载到id为app的元素上。var app 是创建的app vue实例。你把两个名字改个不一样试试