diff --git a/vue3-app/src/components/TrameTemplate.js b/vue3-app/src/components/TrameTemplate.js index aee6e93..54c5445 100644 --- a/vue3-app/src/components/TrameTemplate.js +++ b/vue3-app/src/components/TrameTemplate.js @@ -40,6 +40,15 @@ export function setup() { // Server update reactivity const onDirty = ({ type, keys }) => { + if (type === "new-keys") { + for (let i = 0; i < keys.length; i++) { + const name = keys[i]; + if (publicAPI[name] === undefined) { + publicAPI[name] = toRef(trame, name, modifiedState); + } + } + } + if (type === "dirty-state") { for (let i = 0; i < keys.length; i++) { modifiedState[keys[i]](); diff --git a/vue3-app/src/core/trame/state.js b/vue3-app/src/core/trame/state.js index d4e4fb7..22acb90 100644 --- a/vue3-app/src/core/trame/state.js +++ b/vue3-app/src/core/trame/state.js @@ -53,20 +53,20 @@ export class SharedState { } this.mtime += 1; - let newKeyCount = 0; + const newKeys = []; for (let i = 0; i < updatedKeys.length; i++) { const key = updatedKeys[i]; if (this.keyTS[key] === undefined) { - newKeyCount++; + newKeys.push(key); } this.keyTS[key] = this.mtime; } - if (newKeyCount) { - this.notifyListeners({ type: "refresh" }); - } else { - this.notifyListeners({ type: "dirty-state", keys: updatedKeys }); + if (newKeys.length > 0) { + this.notifyListeners({ type: "new-keys", keys: newKeys }); } + + this.notifyListeners({ type: "dirty-state", keys: updatedKeys }); }; this.subscriptions.push(