zoukankan      html  css  js  c++  java
  • 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>
    

      

  • 相关阅读:
    Spring Boot基础
    MyBatis开启二级缓存
    MyBatis逆向工程
    html实现“加入收藏”代码
    vue-router 基本使用
    vue 脚手架安装
    webpack入门 webpack4常见出错之处
    $.ajax()方法详解
    防止网页被嵌套
    H5字符实体参考
  • 原文地址:https://www.cnblogs.com/renleiblog/p/13074078.html
Copyright © 2011-2022 走看看