【微信小程序】behaviors使用传参

behaviors类似vue中mixins的功能，官方文档：Behavior，简单写一个倒计时功能，properties传入参数。

一、定义Behavior

// useCountdown.js
let countTimer = null;module.exports = Behavior({properties: {countTotal: {type: Number,value: 60,},},data: {countTime: 0,},methods: {clearCountTimer() {if (countTimer !== null) {clearInterval(countTimer);countTimer = null;}},startCountTimer() {this.setData({countTime: this.data.countTotal,});this.clearCountTimer();countTimer = setInterval(() => {const time = this.data.countTime - 1;this.setData({countTime: time,});if (time <= 0) {this.clearCountTimer();}}, 1000);},},detached() {this.clearCountTimer();},
});

二、页面中引入

// page main.js
const useCountdown = require("../../../mixin/useCountdown");
Page({behaviors: [useCountdown],/*** 生命周期函数--监听页面加载*/onLoad(options) {this.setData({countTotal: 120,    // setData更新参数});},getCaptcha() {// 调用接口this.startCountTimer();}
});

<!-- page main.wxml --><view class="login-captcha"><text wx:if="{{countTime === 0}}" bindtap="getCaptcha">获取</text><text wx:else>{{ countTime }}s</text></view>

【微信小程序】behaviors使用传参相关推荐

uni-app 微信小程序分享功能传参接收与调试
uni-app 微信小程序功能传参接收与调试当使用微信小程序进行分享好友功能时,怎样能够联调,查看是否接收到参数,并在被分享人点进来的时候逻辑处理是否正确. 1.分享功能实现分享给朋友 ...
原生微信小程序跳转传参 : [非TabBar跳转传参] 和 [TabBar跳转传参]
一般常用的微信小程序跳转分为两种 1.非TabBar跳转 2.TabBar跳转 1.非TabBar跳转非TabBar页面的跳转通常使用wx.navigateTo来跳转页面,在链接后面加 ? 传参,如 ...
微信小程序uni.switchTab传参获取不到；小程序跳转到tabBar页并传参；uni-app微信小程序获取tabBar页面参数失败；uni-app微信小程序tabBar页面onLoad不执行
需求场景:从非tabBar页面B跳转到tabBar页面A,并想要携带参数. 如果使用uni.switchTab传参,会导致tabBAE页面获取不到参数: 原因: 官方文档有说,uni.switchTa ...
微信小程序使用formdata传参上传图片
先看下接口方法: 需要自己写formdata,因为小程序中不支持formdata传参建立一个formdata文件夹,以及两个子文件 index.js import mimeMap from ' ...
微信小程序自定义组件传参
组件传参 1.父组件通过属性的方式给子组件传参 2.子组件通过事件的方式向父组件传参父组件给子组件传参: 1.父组件中,在组件标签名中,将属性名和要传递的数据进行绑定,用于传递数据 2..在自定义组 ...
微信小程序---双向绑定传参
1.双向绑定 1.1html <view class="text"><textarea placeholder=" 来呀,写下你的心情" va ...
微信小程序组件的传参
# 父子关系 1.父向子传参 // 子组件:通过 properties 声明要从父组件中接收的数据 // 组件的属性列表 properties:{ tabId:String } // 父组件:通 ...
微信小程序的事件传参
1. 什么是事件委托将子元素的事件委托(绑定)给父元素 2. 事件委托的好处(ul 下面的100li需要添加事件,可以直接绑定再父元素上) 1. 减少绑定的次数 2. 后期新添加 ...
微信小程序分享路径传参的问题
最近在开发一个类似于小年糕的视频工具类的小程序,在写分享功能的时候需要实现以下两种场景 1. 当点击某个视频分享出去时,好友打开到视频详情页播放视频,返回时跳到首页. 2. 当在用户主页点击分享时,好 ...
微信小程序跳转传参的方法
目的: 带着第一个页面的id,传到第二个页面,实现同一个页面,点击不同商品显示对应的数据首先在第一个页面的js文件中写好接口 Page({data: {content:"",}, ...

【微信小程序】behaviors使用传参

一、定义Behavior

二、页面中引入

【微信小程序】behaviors使用传参相关推荐

最新文章

热门文章