vue select change事件如何传递自定义参数
更新时间：2022年04月07日 14:47:48 作者：JiaPeng366
这篇文章主要介绍了vue select change事件如何传递自定义参数，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
select change事件传递自定义参数
今天记录一个小问题，最近get到的一个方法，不太常用，记录一下，增强记忆吧。
之前在vue项目中，也经常使用select标签，也经常用change事件，经常用的change事件中，一直有个默认参数，就是选中的选项的信息，最近一个需求除了需了选中项信息外，还需要其他的参数。
今天记录一下这种传参方式，直接上代码。
// 普通用法，没有自定义参数
@change="handleChange"
handleChange (event) {
// event.target.value 是change事件默认传的信息
console.log(event.target.value)
}
// 需要传自定义参数时
@change="handleChange($event, '自定义参数')"
handleChange (event, param) {
// event.target.value 是change事件默认传的信息
// param 是自定义的参数
}@change函数传自定义参数
在vue项目中，某些场景中CheckBox等一些组件的@change函数需要传一些自定义参数
实例
<el-checkbox label="hello" v-model="helloNum" @change="changeFunc($event,'自定义参数')" ></el-checkbox>
methods: {
changeFunc(val,'自定义参数') {
console.log(val,'自定义参数')
//打印结果是：true/false ,'自定义参数'
}
}以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
虽然Vue.js作为一个现代化的前端框架,鼓励使用其自身的响应式机制来处理DOM操作,但在某些情况下,尤其是在需要维护旧系统的项目中,可能会遇到需要引入jQuery的情况,本文将详细讲解如何在Vue项目中引入jQuery,需要的朋友可以参考下2024-09-09
在开发webapp的时候总是会受到首屏加载时间过长的影响，越来越多的APP采用了“骨架屏”的方式去提升用户体验。这篇文章主要介绍了Vue页面骨架屏的实现方法,感兴趣的小伙伴们可以参考一下2018-05-05
这篇文章主要介绍了Vue开发之封装分页组件与使用,结合实例形式分析了vue.js封装分页组件操作以及使用组件进行分页的相关实现技巧,需要的朋友可以参考下2019-04-04
这篇文章主要介绍了vue如何实现的数据控制视图的相关知识，本文给大家介绍的非常详细，具有一定的参考借鉴价值,需要的朋友可以参考下2020-01-01
在本文章里小编给大家整理了关于Vue中this.$nextTick的作用及用法，有需要的朋友们可以跟着学习参考下。2020-02-02
Vue.js 提供了一个方法 watch，它用于观察Vue实例上的数据变动。下面这篇文章主要给大家介绍了关于Vue.js中关于侦听器（watch）的高级用法的相关资料，文中通过示例代码介绍的非常详细，需要的朋友可以参考下2018-05-05
这篇文章主要介绍了Vue实现全局的toast组件方式，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2023-03-03
vue 是一个 渐进式的javascript框架，脚手架是一个通用概念，帮助搭建项目的工具，本文以vue2为例结合实例代码给大家详细讲解，感兴趣的朋友跟随小编一起看看吧2022-12-12
本文旨在给大家提供一种构建一个完整 UI 库脚手架的思路。通过实例代码给大家讲解了使用 Vue cli 3.0 构建自定义组件库的方法，感兴趣的朋友跟随小编一起看看吧2019-04-04
这篇文章主要介绍了基于Vue3实现组件封装的技巧,本文在Vue3的基础上针对一些常见UI组件库组件进行二次封装,旨在追求更好的个性化,更灵活的拓展,感兴趣的小伙伴跟着小编一起来看看吧2024-09-09
最新评论