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

本文主要是介绍统一管理：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内的代码不会显得冗余

这篇关于统一管理：Vue公共组件/公共样式/全局自定义指令的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---