vue和微信小程序的区别和比较

在前言中写了vue项目和小程序，发现两者有很多相似之处。这里我想总结一下两者的共性和差异。相比之下，小程序的钩子函数就简单多了。自己写了vue项目和小程序，发现它们有很多相似之处。这里我想总结一下两者的共性和差异。1.生命周期先贴两张图：vue生命周期小程序生命周期相比之下，小程序的hook函数就简单多了。vuehook函数在跳转到新页面时，会触发hook函数，但是小程序的hook函数，页面的不同跳转方式，触发的hook是不一样的。onLoad：页面加载时只会调用一次，打开当前页面调用的查询参数可以在onLoad中获取。onShow：每次打开页面都会调用页面显示。onReady：页面初始渲染后，一个页面只会被调用一次，表示页面准备就绪，可以与视图层进行交互。wx.setNavigationBarTitle等界面设置请在onReady之后设置。详见生命周期onHide：切换navigateTo或bottomtab时页面隐藏时调用。onUnload：在redirectTo或navigateBack时页面卸载时调用。数据请求页面加载时请求数据，这两个钩子的使用有些类似。Vue一般在created或者mounted中请求数据，而在小程序中则是在onLoad或者onShow中请求数据。2、数据绑定VUE：Vue动态绑定一个变量值到元素的一个属性时，会在变量前加一个冒号：例：1.小程序：当值一个变量绑定到一个元素属性，它将被括在两个大括号中。如果没有大括号，它将被视为一个字符串。例子：1.3.列表渲染直接贴代码，两者还是有点类似vue:1.2.3.{{item.消息}}4.5.7.varexample1=newVue({8.el:'#example-1',9.data:{10.items:[11.{message:'Foo'},12.{message:'Bar'}13.]14.}15.})applet:1.Page({2.data:{3.items:[4.{message:'Foo'},5.{message:'Bar'}6.]7.}8.})10.{{item}}四、显示与隐藏elements在vue中，使用v-if和v-show控制元素的显示和隐藏在小程序中，使用wx-if和hidden控制元素的显示和隐藏五、事件处理vue：使用v-on:event绑定事件，或者使用@event绑定事件，例如：1.Add12.Add1//防止事件冒泡在小程序中，使用bindtap(bind+event)或catchtap(catch+event)绑定事件，例如：1.No明天上班2.明天不上班//防止事件冒泡六、双向数据绑定1、在vue中设置值，只需要在form元素中添加v-model，然后在data中绑定一个对应的值。当表单元素的内容发生变化时，data中对应的值也会随之变化，这是vue非常好的一点1.2.3.