我是靠谱客的博主 无心棒棒糖,最近开发中收集的这篇文章主要介绍uniapp和微信小程序的区别,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

1、页面标签基本相同

view,text、scroll-view,input、picker、swiper等等

2、api基本相同,wx换成uni即可

原生写法:wx.request、wx.showModal、wx.showToast、wx.showLoading、wx.chooseImage、wx.switchTab、wx.navigateo、wx.setStorageSync等等

uniapp写法:uni.request,uni.showModal、uni.showToast、uni.showLoading、uni.chooseImage、uni.switchTab、uni..navigateo、uni.setStorageSync等等

3、生命周期函数相同

onLoad,onShow,onPullDownRefresh、onReachBotton、onShareAppMessage等等

点击事件写法不同

原生小程序是bindtap

<image bindtap="preview"></image>

uniapp是@click

<image @click="preview"></image>

传参方式不同

原生写法是data-xxx

<image bindtap="preview" data-src = '{{item.src}}' ></image>

 preview(e) {    console.log( e.currentTarget.dataset.src)   },

uniapp写法

<image @click="preview(item.src)" ></image>

  preview(src) {    console.log(src)   },   input的value值绑定并监听 原生写法是    <input value='{{sex}}' bindinput='jianting'></input> jianting(e){ //实时监听 console.log(e.detail.value) }   uniapp写法是 <input v-model='sex'></input>   属性绑定   原生写法是   <image src='{{src}}' ></image> uniapp写法是 <input :src='src'></input>   更新视图方法  原生写法   this.setData({       data: 1     })   uniapp写法是 this.data = 1   列表循环  原生写法 <view class="flexcost mtb30" wx:for="{{list}}" wx:key='goodsOrderId' >{{item.name}}</view> //默认是item uniapp写法 <view v-for="(item, index) in list" :key="res.goodsOrderId">{{item.name}}</view>

最后

以上就是无心棒棒糖为你收集整理的uniapp和微信小程序的区别的全部内容,希望文章能够帮你解决uniapp和微信小程序的区别所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(67)

评论列表共有 0 条评论

立即
投稿
返回
顶部