vue 挂载 文件夹的所有组件

本文详细介绍了如何在Vue.js项目中挂载一个文件夹下的所有组件,包括步骤:首先,通过遍历文件夹注册组件;然后,说明在页面中如何有效地使用这些挂载的组件。
摘要由CSDN通过智能技术生成

挂载

// 自动挂载组件 S
let regOaFormTemplate = {}
const allComponents = require.context("@/components/oa/template", true, /\.vue$/)
allComponents.keys().forEach((fileName) => {
 let comp = allComponents(fileName)
  // 组件名称
 var naem = fileName.replace(/^\.\/(.*)\.\w+$/, "$1") + "Template"
  // 挂载组件
 regOaFormTemplate[naem] = comp.default
})
// 自动挂载组件 E

注册组件

components: {
 ...regOaFormTemplate,
},

页面使用

<component :is="`${definitionKey}Template`"></component>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值