diff --git a/packages/editor/src/layouts/sidebar/layer/LayerPanel.vue b/packages/editor/src/layouts/sidebar/layer/LayerPanel.vue
index 9c16afdc..e46af841 100644
--- a/packages/editor/src/layouts/sidebar/layer/LayerPanel.vue
+++ b/packages/editor/src/layouts/sidebar/layer/LayerPanel.vue
@@ -14,7 +14,7 @@
       @node-dragstart="handleDragStart"
       @node-dragleave="handleDragLeave"
       @node-dragend="handleDragEnd"
-      @node-contextmenu="nodeContentmenuHandler"
+      @node-contextmenu="nodeContentMenuHandler"
       @node-mouseenter="mouseenterHandler"
       @node-click="nodeClickHandler"
     >
@@ -113,7 +113,7 @@ const { handleDragStart, handleDragEnd, handleDragLeave, handleDragOver } = useD
 const {
   menu,
   nodeClickHandler,
-  nodeContentmenuHandler,
+  nodeContentMenuHandler,
   highlightHandler: mouseenterHandler,
 } = useClick(services, isCtrlKeyDown, nodeStatusMap);
 </script>
diff --git a/packages/editor/src/layouts/sidebar/layer/use-click.ts b/packages/editor/src/layouts/sidebar/layer/use-click.ts
index 5af1a918..48069044 100644
--- a/packages/editor/src/layouts/sidebar/layer/use-click.ts
+++ b/packages/editor/src/layouts/sidebar/layer/use-click.ts
@@ -94,7 +94,7 @@ export const useClick = (
 
     nodeClickHandler,
 
-    nodeContentmenuHandler(event: MouseEvent, data: TreeNodeData) {
+    nodeContentMenuHandler(event: MouseEvent, data: TreeNodeData) {
       event.preventDefault();
 
       const nodes = services?.editorService.get('nodes') || [];
diff --git a/packages/editor/src/layouts/sidebar/layer/use-node-status.ts b/packages/editor/src/layouts/sidebar/layer/use-node-status.ts
index fadc6c69..2d10d053 100644
--- a/packages/editor/src/layouts/sidebar/layer/use-node-status.ts
+++ b/packages/editor/src/layouts/sidebar/layer/use-node-status.ts
@@ -1,7 +1,7 @@
 import { computed, ref, watch } from 'vue';
 
 import type { Id, MNode, MPage, MPageFragment } from '@tmagic/schema';
-import { getNodePath } from '@tmagic/utils';
+import { getNodePath, isPage, isPageFragment } from '@tmagic/utils';
 
 import { LayerNodeStatus, Services } from '@editor/type';
 import { traverseNode } from '@editor/utils';
@@ -48,13 +48,14 @@ export const useNodeStatus = (services: Services | undefined) => {
 
   // 切换页面或者新增页面，重新生成节点状态
   watch(
-    page,
-    (page) => {
-      if (!page) {
+    () => page.value?.id,
+    (pageId) => {
+      if (!pageId) {
         return;
       }
+
       // 生成节点状态
-      nodeStatusMaps.value.set(page.id, createPageNodeStatus(page, nodeStatusMaps.value.get(page.id)));
+      nodeStatusMaps.value.set(pageId, createPageNodeStatus(page.value!, nodeStatusMaps.value.get(pageId)));
     },
     {
       immediate: true,
@@ -85,6 +86,8 @@ export const useNodeStatus = (services: Services | undefined) => {
 
   services?.editorService.on('add', (newNodes: MNode[]) => {
     newNodes.forEach((node) => {
+      if (isPage(node) || isPageFragment(node)) return;
+
       traverseNode(node, (node: MNode) => {
         nodeStatusMap.value?.set(node.id, {
           visible: true,