小程序和Vue关于绑定数据书写上的区别

Vue：

点击

小程序：

点击

Vue是通过v-on：事件名字='回调函数名'。
小程序以bin或catch开头，后面跟着事件类型，例如bindtap、catchtouchstart。自基础库版本1.5.0起，bind和catch后可以紧跟一个冒号，其含义不变，如bind:tap、catch:touchstart。同时bind和catch·前还可以加上capture-来表示捕获阶段。bind事件绑定不会阻止冒泡事件向上冒泡，catch事件绑定可以阻止冒泡事件向上冒泡。

Vue:

• 标签中的属性（HTML的特性）：“指令：属性名字=‘绑定的数据变量’ ”，v-bind：title='message'，v-bind和v-on可以分别缩写:空（省去）和@
  例如： 鼠标悬停几秒钟查看此处动态绑定的提示信息！
  v-bind是一条指令，表示绑定属性，还有v-once：只执行一次，v-html=“rawhtml”：显示html
  完整示例：

//html
  
    鼠标悬停几秒钟查看此处动态绑定的提示信息！
  
//jsvar app2 = new Vue({
  el: '#app-2',
  data: {
    message: '页面加载于 ' + new Date().toLocaleString()
  }
})

• 只有文本绑定的数据变量才用“{{数据变量}}”，其实双大括号就是将数据解释为普通文本。

//html
    
Using mustaches: {{ rawHtml }}
    
Using v-html directive: 
    //js
    var app=new Vue({
        el:'#app-7',
        data:{
            rawHtml:'红色'    
        }
    })

输出：

小程序
所有的数据绑定统统用大括号包含，如果是组件中的数据绑定需要在大括号外加引号，文本不需要加引号。

    
    {{item.name}}
 

小程序
定义模板：，该模板也是.wxml文件

  
    
      
      {{title}}
    
  

使用模板：只需要在文件顶部引用

Vue中的组件
在js中定义，例如

Vue.component('my-component', {
  template: 'Hi
'
})

应用组件，在html中引入

Vue使用来包含，小程序使用。

小程序

      获取头像昵称
      
        
        {{userInfo.nickName}}
      

还有一个小的重要区别，vue的写法都是v-xx=“xxx”，小程序是wx:xx="xxx"

在小程序中沿用HTML的属性，属性=“{{变量或js表达式}}|字符串”。如果属性值是静态的，就直接用字符串表示，如果属性值是动态变化的，那么就直接让属性=变化的js表达式或变量。
例如：

//src是静态
 //src动态，有变量值决定，下面显示的是一个js表达式

而Vue中，如果属性是动态变化的话，那么就需要借助v-bind指令，来帮顶属性，让属性和等号后面的变量或js表达式结合在一起

//url变量打开连接//js表达式打开连接

*共同点：等号后面绑定的变量或者js表达式，均在data中初始化定义，对于js表达式，可以直接在等号后面写

作者：fenerchen
链接：https://www.jianshu.com/p/0d8723704531