mirror of
https://github.com/Tencent/tmagic-editor.git
synced 2025-04-05 19:41:40 +08:00
fix(runtime): 数据源变化更新页面出错
This commit is contained in:
parent
58b62d18e4
commit
0df98bc226
@ -23,7 +23,7 @@ import Core from '@tmagic/core';
|
||||
import type { ChangeEvent } from '@tmagic/data-source';
|
||||
import type { MNode } from '@tmagic/schema';
|
||||
import { AppContent } from '@tmagic/ui-react';
|
||||
import { replaceChildNode } from '@tmagic/utils';
|
||||
import { isPage, replaceChildNode } from '@tmagic/utils';
|
||||
|
||||
function App() {
|
||||
const app = useContext<Core | undefined>(AppContent);
|
||||
@ -33,11 +33,16 @@ function App() {
|
||||
const [config, setConfig] = useState(app.page.data);
|
||||
|
||||
app.dataSourceManager?.on('update-data', (nodes: MNode[], sourceId: string, event: ChangeEvent) => {
|
||||
let pageConfig = config;
|
||||
nodes.forEach((node) => {
|
||||
replaceChildNode(node, [config]);
|
||||
if (isPage(node)) {
|
||||
pageConfig = node;
|
||||
} else {
|
||||
replaceChildNode(node, [pageConfig]);
|
||||
}
|
||||
});
|
||||
|
||||
setConfig(cloneDeep(config));
|
||||
setConfig(cloneDeep(pageConfig));
|
||||
|
||||
setTimeout(() => {
|
||||
app.emit('replaced-node', {
|
||||
|
@ -3,23 +3,27 @@
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, inject, nextTick, reactive } from 'vue';
|
||||
import { defineComponent, inject, nextTick, reactive, ref } from 'vue';
|
||||
|
||||
import Core from '@tmagic/core';
|
||||
import type { ChangeEvent } from '@tmagic/data-source';
|
||||
import type { MNode } from '@tmagic/schema';
|
||||
import { replaceChildNode } from '@tmagic/utils';
|
||||
import { isPage, replaceChildNode } from '@tmagic/utils';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'App',
|
||||
|
||||
setup() {
|
||||
const app = inject<Core | undefined>('app');
|
||||
const pageConfig = reactive(app?.page?.data || {});
|
||||
const pageConfig = ref(app?.page?.data || {});
|
||||
|
||||
app?.dataSourceManager?.on('update-data', (nodes: MNode[], sourceId: string, changeEvent: ChangeEvent) => {
|
||||
nodes.forEach((node) => {
|
||||
replaceChildNode(reactive(node), [pageConfig as MNode]);
|
||||
if (isPage(node)) {
|
||||
pageConfig.value = node;
|
||||
} else {
|
||||
replaceChildNode(reactive(node), [pageConfig.value as MNode]);
|
||||
}
|
||||
});
|
||||
|
||||
if (!app) return;
|
||||
|
@ -3,23 +3,27 @@
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, inject, nextTick, reactive } from 'vue';
|
||||
import { defineComponent, inject, nextTick, reactive, ref } from 'vue';
|
||||
|
||||
import Core from '@tmagic/core';
|
||||
import type { ChangeEvent } from '@tmagic/data-source';
|
||||
import type { MNode } from '@tmagic/schema';
|
||||
import { replaceChildNode } from '@tmagic/utils';
|
||||
import { isPage, replaceChildNode } from '@tmagic/utils';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'App',
|
||||
|
||||
setup() {
|
||||
const app = inject<Core | undefined>('app');
|
||||
const pageConfig = reactive(app?.page?.data || {});
|
||||
const pageConfig = ref(app?.page?.data || {});
|
||||
|
||||
app?.dataSourceManager?.on('update-data', (nodes: MNode[], sourceId: string, changeEvent: ChangeEvent) => {
|
||||
nodes.forEach((node) => {
|
||||
replaceChildNode(reactive(node), [pageConfig as MNode]);
|
||||
if (isPage(node)) {
|
||||
pageConfig.value = node;
|
||||
} else {
|
||||
replaceChildNode(reactive(node), [pageConfig.value as MNode]);
|
||||
}
|
||||
});
|
||||
|
||||
if (!app) return;
|
||||
|
Loading…
x
Reference in New Issue
Block a user