ant-design-vue和element-ui冲突解决方案
我这个项目vue2,主要使用ant-design-vue;但是ant-design-vue,table有一些我无法处理的缺陷(也许是本人菜);因此引入了element-ui部分组件(el-table, el-table-column);
主要冲突点是:$xxx之间的冲突,搜了一些方案,包括:
1、node命令处理
2、patch包
3、本次采用方案:
查看node_modules/ant-design-vue/es/index.js,主要对下面这些内容挂载到Vue.prototype;将这块重新到utils文件夹下,并在main.js内使用;
文件一:utls/useAntDesign.js
// 主UI框架使用ant-design-vue; 代码旨在兼容element-ui和ant-design-vue冲突问题;
import { Message as message, Notification as notification, Modal } from 'ant-design-vue';
const install = function (Vue) {
Vue.prototype.$message = message;
Vue.prototype.$notification = notification;
Vue.prototype.$info = Modal.info;
Vue.prototype.$success = Modal.success;
Vue.prototype.$error = Modal.error;
Vue.prototype.$warning = Modal.warning;
Vue.prototype.$confirm = Modal.confirm;
Vue.prototype.$destroyAll = Modal.destroyAll;
};
export default install;
文件二:main.js
// 主UI框架使用ant-design-vue;
import useAntDesign from "@/utils/useAntDesign.js";
useAntDesign(Vue);
本文来自博客园,作者:Math点PI,个性签名:“不写bug怎么进步?”,转载请注明原文链接:https://www.cnblogs.com/MrZhous/p/18897158

浙公网安备 33010602011771号