<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>vue原理探析</title> <script src="js/vue.min.js"></script> </head> <body> <!--2.div的设计--> <div id="vue_det"> <h1>site : {{site}}</h1> <h1>url:{{url}}</h1> <h1>alexa:{{alexa}}</h1> </div> <!--3.js的设计,将之前的代码分解.--> <script> //1.数据对象,实际是json格式; var data={site:"CSDN中国",url:"www.csdn.net",alexa:88888}; //2.Vue对象的实例，需要实例化,new Vue({}) var vm=new Vue({ el:'#vue_det', data:data }); //3.测试引用是否相同的对象 ； console.log(vm.site===data.site);//从vm进行测试 vm.site="www.51cto.com"; console.log(data.site);//从data数据端测试 data.alexa=9999; console.log(vm.alexa); </script> </body></html>Vue 实例还提供了一些有用的实例属性与方法。它们都有前缀 $，以便与用户定义的属性区分开来。
