Vue-------自定义指令

html部分:

html 复制代码
<el-button type="primary" v-lxt="asd" round>主要按钮</el-button>

js:

注意:js要小写v+首字母大写,自定义事件里面一定要有生命周期哦

javascript 复制代码
const vLxt = {
  created(el, binding, vnode, prevVnode) {
    el.addEventListener('click', function () {
      console.log(2143353);
    })
    console.log(el, 1);
    console.log(binding, 2);
    console.log(vnode, 3);
    console.log(prevVnode, 4);
  },
  // 在元素被插入到 DOM 前调用
  beforeMount() { },
  // 在绑定元素的父组件
  // 及他自己的所有子节点都挂载完成后调用
  mounted() { },
  // 绑定元素的父组件更新前调用
  beforeUpdate() { },
  // 在绑定元素的父组件
  // 及他自己的所有子节点都更新后调用
  updated() { },
  // 绑定元素的父组件卸载前调用
  beforeUnmount() { },
  // 绑定元素的父组件卸载后调用
  unmounted() { },
}

ヾ( ̄▽ ̄)Bye~Bye~

相关推荐
Hilaku几秒前
我为什么认为 CSS-in-JS 是一个失败的技术?
前端·css·前端框架
月下点灯12 分钟前
✨项目上线后产品要求把应用字体改大点📏怎么办?一招教你快速解决🔧
前端·vite
xvmingjiang24 分钟前
Vue 3 中监听多个数据变化的几种方法
前端·javascript·vue.js
我有一只臭臭25 分钟前
ES5 和 ES6 类的实现
前端·javascript·es6
excel26 分钟前
Three.js 实现高分辨率地球边界可视化
前端
LaoZhangAI39 分钟前
Google Gemini AI图片编辑完全指南:50+中英对照提示词与批量处理教程(2025年9月)
前端·后端
2301_8210465240 分钟前
Python的深度学习
开发语言·javascript·ecmascript
用户114818678948443 分钟前
从零搭建 Vue3 + Nest.js 实时通信项目:4 种方案(短轮询 / 长轮询 / SSE/WebSocket)
前端·后端
LaoZhangAI44 分钟前
Google Gemini Nano与Banana AI完整部署指南:2025年轻量级AI解决方案
前端·后端
用户11481867894841 小时前
基于 Webpack Module Federation 的 Vue 微前端实践
前端