magiccube-vue3
v1.2.27
Published
vue3-js版组件库
Downloads
558
Readme
magiccube-vue3
魔方 VUE version 3 控件项目
package引用方法
1.安装
npm install magiccube-vue3
2.在main.js中引入
import mv3 from 'magiccube-vue3'
import 'magiccube-vue3/package/style/index.less'
3.修改vue.config.js
chainWebpack: config => {
config.module
.rule('package')
.test(/\.(js|jsx)$/)
.include.add(path.join(__dirname, 'node_modules/magiccube-vue3'))
.end()
.use('babel-loader')
.loader('babel-loader')
.options({
presets: [
'@vue/cli-plugin-babel/preset',
],
plugins: [
'@babel/plugin-proposal-optional-chaining'
]
})
}
package menu
- McLink
- McBreadcrumb
- McButton
- McCheckbox
- McCheckboxGroup
- McRadio
- McRadioGroup
- McProgress
- McInput
- McSlide
- McSwitch
- McTab
- McTextarea
- McTree
- McCity
- McCityPicker
- McAddress
- McFuzzySearch
- McTip
- McPopup
- McTable
- McTableColumn
- McPagination
- McForm
- McFormItem
- McSelect
- McSelectOption
- McDatePicker
- McMonthPicker
- McDropdown
- McImport
- McCollapse
- McCollapseItem
- McCollapseTransition
- McUpload
- McDepartmentTree
- McDepartmentPicker
- McPermissionTree
- McLabel
- McJobFuncPicker
- McTableV2
- McTableV2Column
控件使用
<!-- new version table -->
<- Mc-table-v2 :data="listData" checkbox type="fixed" height="auto">
<- Mc-table-v2-column label="姓名" key-name="name">
<template #default="scope">
<- McLink>{{scope.data['name']}}</- McLink>
</template>
</- Mc-table-v2-column>
<- Mc-table-v2-column label="客户名称" header-tip="asdasdads">
<- Mc-table-v2-column label="客户名称123" key-name="companyName" header-tip="1231313132"></- Mc-table-v2-column>
<- Mc-table-v2-column label="客户名称345" key-name="mobile"></- Mc-table-v2-column>
</- Mc-table-v2-column>
<- Mc-table-v2-column label="外包岗位名称" key-name="jobName"></- Mc-table-v2-column>
<- Mc-table-v2-column label="证照号码" key-name="identity"></- Mc-table-v2-column>
<- Mc-table-v2-column label="手机号码" key-name="mobile"></- Mc-table-v2-column>
<- Mc-table-v2-column label="个人信息ID" key-name="resumeId"></- Mc-table-v2-column>
<- Mc-table-v2-column label="企业微信" key-name="companyWechatDesc"></- Mc-table-v2-column>
<- Mc-table-v2-column label="员工状态" key-name="globalStateDesc"></- Mc-table-v2-column>
<- Mc-table-v2-column label="订单名称" key-name="orderName"></- Mc-table-v2-column>
<- Mc-table-v2-column label="岗位城市" key-name="jobCityDesc"></- Mc-table-v2-column>
<- Mc-table-v2-column label="合同编号" key-name="contractCode"></- Mc-table-v2-column>
<- Mc-table-v2-column label="离职时间" key-name="dimissionTime"></- Mc-table-v2-column>
</- Mc-table-v2>