当前位置: 首页 > news >正文

统一管理:Vue公共组件/公共样式/全局自定义指令

main.js 引入存放公共文件的文件路径

import "./plugins";

src/plugins文件夹下的index.js 在处理公共文件中分别引入

/* 公共引入,勿随意修改,修改时需经过确认 */
import Vue from "vue";import "@/icons";   // 图标
import ByuiQueryForm from "@/components/ByuiQueryForm";  // 公共组件
import drag from "@/directive/drag";			// 全局自定义指令/* 自定义指令 */
Vue.use(drag);
/* 组件 */
Vue.component("byui-query-form", ByuiQueryForm);

自定义指令文件夹src/directive/drag: index.js (需要注意指令名)

import drag from "./drag";const install = function (Vue) {// 组件内调用指令:v-dragVue.directive("drag", drag);
};if (window.Vue) {window["drag"] = drag;Vue.use(install);
}drag.install = install;
export default drag;

自定义指令文件夹src/directive/drag: drag.js

export default {bind(el, binding, vnode) { ... },inserted(el){ ... },...
}
全局组件按常规的模版该怎么写怎么写
全局样式第一行加入     @charset "utf-8";
这么处理,main.js内的代码不会显得冗余
http://www.lryc.cn/news/376329.html

相关文章:

  • Linux之旅: 基础知识点的终极指南
  • C#部分方法有什么用处?和传统方法有什么区别?什么时候用合适?
  • elasticsearch hanlp插件远程词典配置
  • 力扣每日一题 6/18 字符串/模拟
  • 架构设计 - Nginx Proxy Cache 缓存配置
  • 【前端】HTML5基础
  • 9个最佳性能测试工具(2024)
  • RTthread+STM32F407ZGTx+烟雾报警检测+蜂鸣器报警+LED闪烁||使用RTthread Studio
  • k8s资源的基本操作
  • 19.面包屑导航制作
  • 做动画?Animatediff 和 ComfyUI 更配哦!
  • 笔记-python里面的xlrd模块详解
  • oracle将字符串中的字符和数字拆分开等功能
  • 汇编基础之使用vscode写hello world
  • APS计划排程系统如何打破装备使用约束
  • gigachad - suid
  • QtScript模块
  • qt中for循环不要使用循环中会更改的变量
  • spark独立集群搭建
  • 【BFS算法】广度搜索·由起点开始逐层向周围扩散求得最短路径(算法框架+题目)
  • 微信小程序---登录
  • IPython大师课:提升数据科学工作效率的终极工具
  • 抖音素材网站平台有哪些?素材下载网站库分享
  • MODBUS TCP协议实例数据帧详细分析
  • Spring Boot启动与运行机制详解:初学者友好版
  • Ubuntu 22.04 解决 firefox 中文界面乱码
  • 前端面试题日常练-day77 【面试题】
  • 团队协同渗透测试报告输入输出平台部署
  • vue3-父子通信
  • 微信小程序—页面滑动,获取可视区域数据