uniapp 手动调用form表单submit事件

背景:

UI把提交的按钮弄成了图片,之前的button不能用了。

<button form-type="submit">搜索</button>

实现:

html:

通过 this.$refs.fd 获取到form的vue对象。手动调用里面的_onSubmit()方法。

复制代码
methods: {
		search(){//图片点击事件
			console.log(this.$refs.fd);
			this.$refs.fd._onSubmit();//手动调用formvue对象的_onSubmit()方法
			// console.log(this.$refs.targetBtn);
		},
		formSubmit(e) {  //原来的form submit事件 不要动,留着
			console.log(e) // 获取原生的 input 事件对
			this.list =[];
			this.formParam =  e.detail.value;
			this.to_Ajax({ ...this.param, ...this.formParam,...this.model});//合并三个参数对象并传递
		},
		formReset(){
			this.param.page = 0;
			this.list = [];
			this.to_Ajax({ ...this.param,...this.model});
			},//合并三个参数对象并传递
		reset(){
			console.log(this.$refs.fd);
			this.$refs.fd._onReset()
			// console.log(this.$refs.targetBtn);
		},
相关推荐
Q_Q19632884751 小时前
python+uniapp基于微信小程序的高校二手商品交易系统
spring boot·python·微信小程序·django·flask·uni-app·node.js
Heyuan_Xie2 小时前
uni-app-配合iOS App项目开发apple watch app
uni-app·apple watch app·uni-app系统教程
莫空00003 小时前
uView Plus TabBar完美适配iOS安全区:告别底部小横条遮挡烦恼!
微信小程序·uni-app
万岳软件开发小城4 小时前
基于Uniapp+PHP的教育培训系统开发指南:网校源码实战剖析
uni-app·php·软件开发·在线教育系统源码·教育平台搭建·教育app开发·网校小程序
從南走到北19 小时前
设备巡检系统小程序ThinkPHP+UniApp
微信小程序·小程序·uni-app·微信公众平台
刘大浪1 天前
uniapp 实战新闻页面(一)
android·uni-app
我是shenzhongchaoii1 天前
写100个前端效率工具(1):uni-app海报生成 uni-wxml2canvas
uni-app
moxiaoran57531 天前
uni-app项目实战笔记16--实现头部导航栏效果
笔记·uni-app
Q_Q5110082851 天前
python+uniapp基于微信小程序健康管理系统
spring boot·python·微信小程序·django·flask·uni-app·node.js
Heyuan_Xie1 天前
uni-app总结5-UTS插件开发
uni-app