vue学习培训

 !-- 开发设计自然环境版本号，包括了有协助的指令行警示 -- 
 script src="npm/vue/dist/vue.js" /script 

或是：

 !-- 生产制造自然环境版本号，提升了规格和速率 -- 
 script src="npm/vue" /script 

看个简易的实例：

 !DOCTYPE html 
 html 
 head 
 meta charset="utf-8" / 
 title -vue /title 
 script src="js/vue.js" type="text/javascript" charset="utf-8" /script 
 /head 
 body 
 div id="app" 
 {{text}}
 /div 
 script 
 var vm=new Vue({
 el:"#app",
 data:{
 text:'文字数据信息被3D渲染到HTML中了哦！'
 /script 
 /body 
 /html 

除开文字插值，大家还能够像那样来关联原素 attribute：

 div id="app-2" 
 span v-bind:title="message" 
 电脑鼠标悬停几秒钟钟查询这里动态性关联的提醒信息内容！
 /span 
 /div 

var app2 = new Vue({
 el: '#app-2',
 data: {
 message: '网页页面载入于 ' + new Date().toLocaleString()
})

v-bind attribute 命令含有作为前缀 v-，以表明他们是 Vue 出示的独特 attribute。将会你早已猜中了，他们会在3D渲染的 DOM 上运用独特的响应式个人行为。在这里里，该命令的含意是：“将这一原素连接点的 title attribute 和 Vue 案例的 message property 维持一致”。

假如你再度开启访问器的 JavaScript 操纵台，键入 app2.message = 新信息 ，便会再一次见到这一关联了 title attribute 的 HTML 早已开展了升级。

VUE官方网实例教程：v2/guide/