megalo
megalo copied to clipboard
第三方小程序组件的 slot 在 vue 组件的非具名 slot 中会失效
代码与复现步骤
首先,基于 megalo-cli 创建一个新项目。
下载 vant-weapp
小程序组件,在 src/main.js
中引入
...
export default {
config: {
...
usingComponents: {
'van-cell': 'native/vant-weapp/cell/index',
'van-cell-group': 'native/vant-weapp/cell-group/index'
}
}
}
创建 TestComp
组件,路径 src/components/TestComp
<template>
<div>
<slot />
<slot name="text" />
</div>
</template>
<script>
export default {
}
</script>
<style>
</style>
修改 src/pages/hello.vue
<template>
<div class="app">
<test-comp>
<div slot="text">
<van-cell title="我在 slot text 里的">
<div slot="icon" style="color: red; margin-right: 10px">图标 </div>
</van-cell>
</div>
<van-cell title="测试" value="值" />
<van-cell title="我在非具名 slot 里">
<div slot="icon" style="color: red; margin-right: 10px">图标</div>
</van-cell>
</test-comp>
</div>
</template>
<script>
import TestComp from '@/components/TestComp'
export default {
components: {
TestComp
}
}
</script>
<style lang="scss">
</style>
问题现象
这里我使用到了 vant-weapp
的组件,发现它的 slot 在 vue 组件的非具名 slot 中会失效。
版本
- megalo
0.10.1
- @megalo/template-compiler
0.10.1
- @megalo/target
0.7.4-0
操作系统信息
macos 10.14.5
我采用文件引入方式,slot在panel内使用,同样无效