更新配置项,更新Receiver入参,修复渲染错误

This commit is contained in:
2025-05-13 16:15:11 +08:00
parent 5d2af32d68
commit 0c75dca9c3
7 changed files with 708 additions and 730 deletions

View File

@@ -1,94 +1,7 @@
import { defineComponent, nextTick, onMounted, ref, getCurrentInstance, isVue3 } from 'vue-demi';
import { defineComponent, nextTick, onMounted, ref, getCurrentInstance, isVue3, h } from 'vue-demi';
import { hh } from './DemiHelper';
import { InvokerContext } from '../types/InvokerContext';
console.log('receiver-loaded');
function renderContext(item: object | Array<any>, toSlot: boolean = false) {
/**
* 对象为字符串的情况
* # { tag: 'div', attrs: undefined, children: 'hhh' } => h('span', undefined, 'hhh')
*/
if (typeof item === 'string')
return item;
/**
* 对象为函数的情况
* # { tag: 'div', attrs: undefined, children: () => 'hhh' } => h('span', undefined, 'hhh')
*/
if (typeof (item) === "function") {
// return item;
return item();
}
/**
* 对象为数组的情况
* # { tag: 'div', attrs: undefined, [ { tag: 'span', attrs: undefined, 'hhh' } ] } => h('div', undefined, [ h('span', undefined, 'hhh') ])
*/
if (Array.isArray(item)) {
const list = item.map(i => {
if (isVue3) {
// const comp = resolveComponent(i.tag);
return hh(i.tag, i.attrs, i.children);
// return hDemi(comp, i.attrs, renderContext(i.children, typeof (comp) !== 'string') as any); // vue3
}
// const { attrs, listeners, ref } = splitAttrs(i.attrs);
const slots = renderContext(i.children);
if (typeof (slots) === "object") {
return hh(i.tag, {
attrs: i.attrs
// attrs,
// on: listeners,
// scopedSlots: slots,
// ref
});
}
return hh(i.tag, {
attrs: i.attrs,
}, slots);
});
if (toSlot) {
return () => list;
}
return list;
}
/**
* 复合对象的情况
* #
*/
const children: Record<string, any> = {};
for (const key in item) {
children[key] = function (scope) {
const child = item[key](scope);
if (isVue3) {
return hh(child.tag, child.attrs, renderContext(child.children, true));
}
if (Array.isArray(child)) {
const slots = renderContext(child);
return slots;
} else {
// const { attrs, listeners, ref } = splitAttrs(child.attrs);
const slots = renderContext(child.children);
return hh(child.tag, {
attrs: child.attrs
// attrs,
// on: listeners,
// ref
}, slots);
}
};
}
return children;
}
export default defineComponent({
name: 'Receiver',
props: {
@@ -98,13 +11,14 @@ export default defineComponent({
},
parentKey: {
type: String,
default: () => 'modInvoker'
default: () => 'MES_MOD_INVOKERS'
}
},
setup(props) {
const instance = getCurrentInstance();
let invokerContext: InvokerContext = null!;
const renderVersion = ref(0);
console.log(`[Mod-Receiver] receiver setup, invokerId: ${props.parentId}, invokerKey: ${props.parentKey}`);
if (window.parent != window) {
const invoker = window.parent[props.parentKey][props.parentId];
invokerContext = invoker;
@@ -112,7 +26,7 @@ export default defineComponent({
else {
throw new Error("[Receiver] 组件必须在iframe中使用");
}
const renderItems = ref(invokerContext.getRenderContext() ?? []);
onMounted(() => {
@@ -124,11 +38,12 @@ export default defineComponent({
return renderVersion.value;
},
Update: function (): void {
console.log('[Receiver] Force Update', renderVersion.value);
console.log('[Mod-Receiver] force update', renderVersion.value);
renderVersion.value += 1;
renderItems.value = invokerContext.getRenderContext() ?? [];
instance?.proxy?.$forceUpdate();
},
// @ts-ignore
get refs() {
return instance?.proxy?.$refs;
}
@@ -136,21 +51,22 @@ export default defineComponent({
}
});
});
return () => {
return (h) => {
try {
console.log('receiver-update', renderVersion.value);
if (renderVersion.value < 0) return;
if (invokerContext.getRenderContext) {
const itemList = invokerContext.getRenderContext() ?? [];
// const list = renderContext(itemList);
// console.log('item-list', list);
return hh('div', undefined, itemList);
console.log("[Mod-Receiver] rendering: ", itemList);
// @ts-ignore
return hh('div', undefined, itemList, h);
}
return hh('div');
console.log("[Mod-Receiver] 'getRenderContext' method not found");
return hh('div', undefined, undefined, h);
}
catch (e) {
console.error("[Receiver] 渲染节点过程中出现错误", e);
console.error("[Mod-Receiver] 渲染节点过程中出现错误", e);
}
};
}