修改工具按钮插槽透传方式,以解决CDN引入VForm后插槽不支持最新v-slot语法的问题。

master
vdpAdmin 2021-12-22 18:27:18 +08:00
parent 2cb1359636
commit 7c0dda007b
4 changed files with 18 additions and 3 deletions

View File

@ -1,6 +1,11 @@
<template>
<div id="app">
<VFormDesigner />
<VFormDesigner>
<!-- 自定义按钮插槽演示 -->
<template #customToolButtons>
<el-button type="text">test</el-button>
</template>
</VFormDesigner>
</div>
</template>

View File

@ -38,7 +38,9 @@
<el-container class="center-layout-container">
<el-header class="toolbar-header">
<toolbar-panel :designer="designer" ref="toolbarRef">
<template #toolButtons><slot name="customToolButtons"></slot></template>
<template v-for="(idx, slotName) in $slots" #[slotName]>
<slot :name="slotName"></slot>
</template>
</toolbar-panel>
</el-header>
<el-main class="form-widget-main">
@ -143,6 +145,11 @@
this.caseName = getQueryParam('case')
},
mounted() {
console.error('slot=====', this.$slots.customToolButtons)
console.info('slot=====2222', this.$slots.customToolButtons)
console.info('slot=====3333', this.$slots)
console.info('test info: ', 'aaaaaaaaaaaaaa')
this.initLocale()
this.scrollerHeight = window.innerHeight - 56 - 36 + 'px'

View File

@ -36,7 +36,9 @@
{{i18nt('designer.toolbar.exportCode')}}</el-button>
<el-button v-if="showToolButton('generateSFCButton')" type="text" @click="generateSFC">
<svg-icon icon-class="vue-sfc" />{{i18nt('designer.toolbar.generateSFC')}}</el-button>
<slot name="toolButtons"></slot>
<template v-for="(idx, slotName) in $slots">
<slot :name="slotName"></slot>
</template>
</div>
<el-dialog :title="i18nt('designer.toolbar.preview')" :visible.sync="showPreviewDialogFlag" v-if="showPreviewDialogFlag"

View File

@ -31,6 +31,7 @@ if (IS_PROD && buildProdFlag) {
module.exports = {
publicPath: './',
assetsDir: './',
/* 开启vue运行时模板编译功能 */