uni-app 开发/学习 笔记

给查询按钮增加防抖功能

utils/common.js中:
// 按钮防抖
export function noMultipleClicks(methods, info) {
   
	// methods是执行的函数名,info是点击需要传的参数,无参数时单传一个方法名
	let _this = this
	if (_this.noClick) {
   
		// 第一次点击
		_this.noClick = false
		if (info && info !== '') {
   
			methods(info)
		} else {
   
			methods()
		}
		// 这里设置2秒后可继续点击
		setTimeout(() => {
   
			_this.noClick = true
		}, 2000)
	} else {
   
		// 重复点击时
		uni.showToast({
   
			icon: 'none',
			title: '点击太频繁，请稍后再试.'
		})
	}
}

main.js中:
import {
    noMultipleClicks } from '@/utils/common.js'
Vue.prototype.$noMultipleClicks = noMultipleClicks

各个文件中:
<button @click="$noMultipleClicks(btnSearch)" type="primary" size="mini">查询</button>
data () {
   
	return {
   
		noClick: true, // 2s内是否点击, 防止重复点击按钮用
	}
},
methods: {
   
	// 点击按钮查询
	btnSearch() {
   
		......
	}
}

路由传参

uni.navigateTo({
    url: `@/pages/me/name=${
     'James'