如上所述必现

- 发布:2025-02-10 15:35
- 更新:2025-02-10 15:35
- 阅读:17
产品分类: uniapp/H5
PC开发环境操作系统: Mac
PC开发环境操作系统版本号: sequoia 15.2 (24C101)
浏览器平台: Chrome
浏览器版本: 131.0.6778.266
项目创建方式: CLI
CLI版本号: 5.0.8
操作步骤:
预期结果:
可以正常解析<slot>中的默认内容
可以正常解析<slot>中的默认内容
实际结果:
无法解析slot中的默认内容,
目前可以用私服更改/@dcloudio/vue-cli-plugin-uni/packages/h5-vue/的代码解决
无法解析slot中的默认内容,
目前可以用私服更改/@dcloudio/vue-cli-plugin-uni/packages/h5-vue/的代码解决
bug描述:
<template>
<div>
<slot name="name1">
<!--该内容不会显示 -->
<div class="test">
默认信息
</div>
</slot>
</div>
</template>
原因是构建后插槽的fallback是个方法
[t._t("name1",(function(){return[n("div",{staticClass:"test"},["默认信息"],1)]}))]
在dcloud的renderSlot中
//node_modules/@dcloudio/vue-cli-plugin-uni/packages/h5-vue/dist
function renderSlot (
name,
fallback,
props,
bindObject
) {
var scopedSlotFn = this.$scopedSlots[name];
var nodes;
if (scopedSlotFn) { // scoped slot
props = props || {};
if (bindObject) {
if ( true && !isObject(bindObject)) {
warn(
'slot v-bind without argument expects an Object',
this
);
}
props = extend(extend({}, bindObject), props);
}
// fixed by xxxxxx app-plus scopedSlot
nodes = scopedSlotFn(props, this, props._i) || fallback;
} else {
//fallback这里没有做类型判断,如果是在当前项目中的自定义插槽,fallback是一个vNode,但外部的组件这里是一个function
nodes = this.$slots[name] || fallback;
}
...
}
这是vue-template-compiler中的
function renderSlot(name, fallbackRender, props, bindObject) {
const scopedSlotFn = this.$scopedSlots[name];
let nodes;
if (scopedSlotFn) {
// scoped slot
props = props || {};
if (bindObject) {
if (process.env.NODE_ENV !== 'production' && !isObject(bindObject)) {
warn$2('slot v-bind without argument expects an Object', this);
}
props = extend(extend({}, bindObject), props);
}
nodes =
scopedSlotFn(props) ||
(isFunction(fallbackRender) ? fallbackRender() : fallbackRender);
} else {
//对比@dcloudio/vue-cli-plugin-uni中的renderSlot多了类型判断
nodes =
this.$slots[name] ||
(isFunction(fallbackRender) ? fallbackRender() : fallbackRender);
}
...
}
0 个回复