uni-app学习随笔

一、数据绑定

  1.在data里面定义并赋值,然后使用{{****}}的方式显示。

  2.v-bind:用来解析链接地址,例如在线图片在data里面定义,使用 v-bind:src(:src)----v-bind:src==:src

  3.v-for:一般都是配套数组使用<view v-for="(item,index) in arr" :key="item.id">序号:{{item.index}},名字:{{item.name}},年龄:{{item.age}}</view>

二、注册事件

  1.button事件触发:<button type="primary" v-on:click="clickHandle">按钮</button>----v-on:click==@click

  2.methods:{clickHandle(){}}------methods方法跟data(){}同级

  3.按钮点击事件触发事件函数clickHandle(20,$event),methods:{clickHandle(num,e){console.log(‘点击我了‘,num,e)}}

三、生命周期函数

  1.概念:一个对象从创建、运行、销毁的整个过程被称为生命周期

  2.下拉刷新函数onPullDownRefresh()

  3.触底函数onReachBottom()

  4.发送get请求使用uni.request

  5.destroyed(){clearInterval(this.intId)}用来销毁页面内的定时器

四、条件兼容

  1.在注释行里面写<!-- #ifdef H5 --><view>只在H5里面显示</view><!-- #endif -->------------注释快捷键ctrl+/

  2.在注释行里面写<!-- #ifdef MP-WEIXIN --><view>只在微信小程序里面显示</view><!-- #endif -->

  3.组件,方法和样式都可以这样用

五、页面通讯 

  uni.$on(eventName,callback)

  监听全局的自定义事件。事件可以由 uni.$emit 触发,回调函数会接收所有传入事件触发函数的额外参数。

  uni.$on(‘eventName‘,num=>{this.num+=num})

  uni.$emit(eventName,OBJECT)

  方法里面调用uni.$emit(‘eventName‘,10)--------10对应上面的num实例

  

<navigator url="/pages/detail/detail?id=80&age=19">跳转页面</navigator>

  

uni-app学习随笔

上一篇:【Vue】02 Component 组件 & Axios


下一篇:C# WinForm开发系列之chart控件画折线图和柱形图并自定义鼠标移动到数据标记点显示提示信息