diff --git a/packages/uni-app-plus/dist/uni-app-view.umd.js b/packages/uni-app-plus/dist/uni-app-view.umd.js
index 00b97c9b997229387edf0bb89f9a1a692869432a..5344dcb66ac9637f3d3455573b8475d9069fdc27 100644
--- a/packages/uni-app-plus/dist/uni-app-view.umd.js
+++ b/packages/uni-app-plus/dist/uni-app-view.umd.js
@@ -5950,10 +5950,10 @@
       };
     }
   });
-  const UniButton = createWrapper(Button);
-  class UniButtonElement extends UniNode {
-    constructor(id) {
-      super(id, "uni-button");
+  class UniComponent extends UniNode {
+    constructor(id, tag, component) {
+      super(id, tag);
+      this.$component = component;
     }
     init(nodeJson) {
       const container = document.createElement("div");
@@ -5964,17 +5964,11 @@
           this.setAttr(n, a[n]);
         });
       }
-      const vm = createApp(UniButton, { attrs: this.$props }).mount(container);
+      createApp(createWrapper(this.$component, this.$props)).mount(container);
       this.$ = container.firstElementChild;
       if (hasOwn$1(nodeJson, "t")) {
         this.$.textContent = nodeJson.t || "";
       }
-      watch(this.$props, () => {
-        {
-          console.log(formatLog(this.tag, "props", "forceUpdate"));
-        }
-        vm.$forceUpdate();
-      });
     }
     setAttr(name, value) {
       const decoded = decodeAttr(name);
@@ -5988,6 +5982,11 @@
       this.$props[decodeAttr(name)] = null;
     }
   }
+  class UniButton extends UniComponent {
+    constructor(id) {
+      super(id, "uni-button", Button);
+    }
+  }
   const BuiltInComponents = [
     ,
     UniViewElement,
@@ -5997,23 +5996,13 @@
     UniComment,
     ,
     ,
-    UniButtonElement
+    UniButton
   ];
   function createBuiltInComponent(type, id) {
     return new BuiltInComponents[type](id);
   }
-  function createWrapper(component) {
-    return defineComponent({
-      props: ["attrs"],
-      data() {
-        return {
-          props: this.attrs
-        };
-      },
-      render() {
-        return h(component, this.props);
-      }
-    });
+  function createWrapper(component, props) {
+    return () => h(component, props);
   }
   const elements = new Map();
   function $(id) {
diff --git a/packages/uni-app-plus/src/PageAction.ts b/packages/uni-app-plus/src/PageAction.ts
index 5a5990c1c469c648769cb5e21ab1374f65b72098..bab96b7f5ddf58ab329cfb0f625cbc4a22e5ae6f 100644
--- a/packages/uni-app-plus/src/PageAction.ts
+++ b/packages/uni-app-plus/src/PageAction.ts
@@ -1,5 +1,5 @@
 import { onNodeEvent } from './service/framework/dom/onNodeEvent'
-import { createElement } from './view/framework/dom/elements'
+import { createElement } from './view/framework/dom/page'
 import { UniElement } from './view/framework/dom/elements/UniElement'
 
 export const ACTION_TYPE_PAGE_CREATE = 1
diff --git a/packages/uni-app-plus/src/view/framework/dom/components/UniButton.ts b/packages/uni-app-plus/src/view/framework/dom/components/UniButton.ts
new file mode 100644
index 0000000000000000000000000000000000000000..7133357973efc00b0d8b5bda55f2d121f09ad4c5
--- /dev/null
+++ b/packages/uni-app-plus/src/view/framework/dom/components/UniButton.ts
@@ -0,0 +1,10 @@
+import '@dcloudio/uni-components/style/button.css'
+import { Button } from '@dcloudio/uni-components'
+
+import { UniComponent } from './UniComponent'
+
+export class UniButton extends UniComponent {
+  constructor(id: number) {
+    super(id, 'uni-button', Button)
+  }
+}
diff --git a/packages/uni-app-plus/src/view/framework/dom/elements/components/UniButtonElement.ts b/packages/uni-app-plus/src/view/framework/dom/components/UniComponent.ts
similarity index 58%
rename from packages/uni-app-plus/src/view/framework/dom/elements/components/UniButtonElement.ts
rename to packages/uni-app-plus/src/view/framework/dom/components/UniComponent.ts
index 2624e2ff6829e89b00739dafc7c2d9d72fafc0fb..8a496a24ff205e123c8e08df9da416fd92b7d7f7 100644
--- a/packages/uni-app-plus/src/view/framework/dom/elements/components/UniButtonElement.ts
+++ b/packages/uni-app-plus/src/view/framework/dom/components/UniComponent.ts
@@ -1,23 +1,16 @@
-import '@dcloudio/uni-components/style/button.css'
 import { hasOwn } from '@vue/shared'
-import { Button } from '@dcloudio/uni-components'
-import { createApp, reactive, watch } from 'vue'
-import { createWrapper } from '.'
-import {
-  decodeAttr,
-  formatLog,
-  parseEventName,
-  UniNodeJSON,
-} from '@dcloudio/uni-shared'
-import { UniNode } from '../UniNode'
+import { Component, createApp, reactive } from 'vue'
+import { decodeAttr, parseEventName, UniNodeJSON } from '@dcloudio/uni-shared'
+import { UniNode } from '../elements/UniNode'
 import { createInvoker } from '../modules/events'
+import { createWrapper } from '.'
 
-const UniButton = createWrapper(Button)
-
-export class UniButtonElement extends UniNode {
+export class UniComponent extends UniNode {
+  private $component: Component
   private $props!: Record<string, any>
-  constructor(id: number) {
-    super(id, 'uni-button')
+  constructor(id: number, tag: string, component: Component) {
+    super(id, tag)
+    this.$component = component
   }
   init(nodeJson: Partial<UniNodeJSON>) {
     const container = document.createElement('div')
@@ -28,17 +21,13 @@ export class UniButtonElement extends UniNode {
         this.setAttr(n, a[n])
       })
     }
-    const vm = createApp(UniButton, { attrs: this.$props }).mount(container)
+    const vm = createApp(createWrapper(this.$component, this.$props)).mount(
+      container
+    )
     this.$ = container.firstElementChild!
     if (hasOwn(nodeJson, 't')) {
       this.$.textContent = nodeJson.t || ''
     }
-    watch(this.$props, () => {
-      if (__DEV__) {
-        console.log(formatLog(this.tag, 'props', 'forceUpdate'))
-      }
-      vm.$forceUpdate()
-    })
   }
   setAttr(name: string, value: unknown) {
     const decoded = decodeAttr(name)
diff --git a/packages/uni-app-plus/src/view/framework/dom/components/index.ts b/packages/uni-app-plus/src/view/framework/dom/components/index.ts
new file mode 100644
index 0000000000000000000000000000000000000000..2b766dcea68212c91303214a1422a7ac9719a944
--- /dev/null
+++ b/packages/uni-app-plus/src/view/framework/dom/components/index.ts
@@ -0,0 +1,35 @@
+import { defineComponent, h } from 'vue'
+import { UniComment } from '../elements/UniComment'
+import { UniText } from '../elements/UniText'
+import { UniViewElement } from '../elements/UniViewElement'
+import { UniButton } from './UniButton'
+
+export interface UniCustomElement extends Element {
+  __id: number
+  __listeners: Record<string, (evt: Event) => void>
+}
+
+const BuiltInComponents = [
+  ,
+  UniViewElement,
+  ,
+  ,
+  UniText,
+  UniComment,
+  ,
+  ,
+  UniButton,
+]
+
+export type WrapperComponent = ReturnType<typeof createWrapper>
+
+export function createBuiltInComponent(type: number, id: number) {
+  return new BuiltInComponents[type]!(id)
+}
+
+export function createWrapper(
+  component: ReturnType<typeof defineComponent>,
+  props: Record<string, any>
+) {
+  return () => h(component, props)
+}
diff --git a/packages/uni-app-plus/src/view/framework/dom/elements/UniElement.ts b/packages/uni-app-plus/src/view/framework/dom/elements/UniElement.ts
index 3910d8d70f84a1ca17427aab3193462f71fbc5d5..f63fd0ad89a652769d6888d44057b841b8b57674 100644
--- a/packages/uni-app-plus/src/view/framework/dom/elements/UniElement.ts
+++ b/packages/uni-app-plus/src/view/framework/dom/elements/UniElement.ts
@@ -2,10 +2,10 @@ import { hasOwn } from '@vue/shared'
 import { decodeAttr, UniNodeJSON } from '@dcloudio/uni-shared'
 
 import { UniNode } from './UniNode'
-import { patchClass } from './modules/class'
-import { patchStyle } from './modules/style'
-import { patchEvent } from './modules/events'
-import { UniCustomElement } from './components'
+import { patchClass } from '../modules/class'
+import { patchStyle } from '../modules/style'
+import { patchEvent } from '../modules/events'
+import { UniCustomElement } from '../components'
 
 export class UniElement extends UniNode {
   $: UniCustomElement
diff --git a/packages/uni-app-plus/src/view/framework/dom/elements/UniNode.ts b/packages/uni-app-plus/src/view/framework/dom/elements/UniNode.ts
index e31ad36e3c61d54be9e8ea132819bf83f17e9f34..bc1209420e50577c4556e0bee3e660c780fa124b 100644
--- a/packages/uni-app-plus/src/view/framework/dom/elements/UniNode.ts
+++ b/packages/uni-app-plus/src/view/framework/dom/elements/UniNode.ts
@@ -1,7 +1,7 @@
 import { hasOwn } from '@vue/shared'
 import { UniNodeJSON } from '@dcloudio/uni-shared'
 
-import { $ } from '.'
+import { $ } from '../page'
 
 export class UniNode {
   id: number
diff --git a/packages/uni-app-plus/src/view/framework/dom/elements/components/index.ts b/packages/uni-app-plus/src/view/framework/dom/elements/components/index.ts
deleted file mode 100644
index b075f4ccff6852ad1dac8d99a8e159854a6e4c19..0000000000000000000000000000000000000000
--- a/packages/uni-app-plus/src/view/framework/dom/elements/components/index.ts
+++ /dev/null
@@ -1,40 +0,0 @@
-import { defineComponent, h, reactive } from 'vue'
-import { UniComment } from '../UniComment'
-import { UniText } from '../UniText'
-import { UniViewElement } from '../UniViewElement'
-import { UniButtonElement } from './UniButtonElement'
-
-export interface UniCustomElement extends Element {
-  __id: number
-  __listeners: Record<string, (evt: Event) => void>
-}
-
-const BuiltInComponents = [
-  ,
-  UniViewElement,
-  ,
-  ,
-  UniText,
-  UniComment,
-  ,
-  ,
-  UniButtonElement,
-]
-
-export function createBuiltInComponent(type: number, id: number) {
-  return new BuiltInComponents[type]!(id)
-}
-
-export function createWrapper(component: ReturnType<typeof defineComponent>) {
-  return defineComponent({
-    props: ['attrs'],
-    data() {
-      return {
-        props: this.attrs,
-      }
-    },
-    render() {
-      return h(component, this.props)
-    },
-  })
-}
diff --git a/packages/uni-app-plus/src/view/framework/dom/elements/index.ts b/packages/uni-app-plus/src/view/framework/dom/elements/index.ts
deleted file mode 100644
index 8789a8d1796294dd25bc35dc491a3e94f8f4f062..0000000000000000000000000000000000000000
--- a/packages/uni-app-plus/src/view/framework/dom/elements/index.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-import { isString } from '@vue/shared'
-import { createBuiltInComponent } from './components'
-
-import { UniElement } from './UniElement'
-import { UniText } from './UniText'
-
-const elements = new Map<number, UniElement | UniText>()
-
-export function $(id: number) {
-  return elements.get(id) as UniElement
-}
-
-export function createElement(id: number, tag: string | number) {
-  let element: UniElement | UniText
-  if (isString(tag)) {
-    element = new UniElement(id, document.createElement(tag))
-  } else {
-    element = createBuiltInComponent(tag, id)
-  }
-  elements.set(id, element)
-  return element
-}
diff --git a/packages/uni-app-plus/src/view/framework/dom/index.ts b/packages/uni-app-plus/src/view/framework/dom/index.ts
index 68e4b7b0a1ad1c16d785f07b834f5d51f7cdccd4..1cbe9e47a3b4365557ab8879c016bd07265e6bd7 100644
--- a/packages/uni-app-plus/src/view/framework/dom/index.ts
+++ b/packages/uni-app-plus/src/view/framework/dom/index.ts
@@ -9,8 +9,7 @@ import {
   ACTION_TYPE_SET_TEXT,
   PageAction,
 } from '../../../PageAction'
-import { $, createElement } from './elements'
-import { onPageCreate, onPageCreated } from './page'
+import { $, createElement, onPageCreate, onPageCreated } from './page'
 
 export function onVdSync(actions: PageAction[]) {
   actions.forEach((action) => {
diff --git a/packages/uni-app-plus/src/view/framework/dom/elements/modules/class.ts b/packages/uni-app-plus/src/view/framework/dom/modules/class.ts
similarity index 100%
rename from packages/uni-app-plus/src/view/framework/dom/elements/modules/class.ts
rename to packages/uni-app-plus/src/view/framework/dom/modules/class.ts
diff --git a/packages/uni-app-plus/src/view/framework/dom/elements/modules/events.ts b/packages/uni-app-plus/src/view/framework/dom/modules/events.ts
similarity index 94%
rename from packages/uni-app-plus/src/view/framework/dom/elements/modules/events.ts
rename to packages/uni-app-plus/src/view/framework/dom/modules/events.ts
index c9653f10919ce7396ff8901763ce6ae8874668a5..68f1bef3a68ff7fa6dcc4b91c26522d62d624015 100644
--- a/packages/uni-app-plus/src/view/framework/dom/elements/modules/events.ts
+++ b/packages/uni-app-plus/src/view/framework/dom/modules/events.ts
@@ -7,8 +7,8 @@ import {
   EventModifierFlags,
   normalizeEventType,
 } from '@dcloudio/uni-shared'
-import { VD_SYNC } from '../../../../../constants'
-import { ACTION_TYPE_EVENT } from '../../../../../PageAction'
+import { VD_SYNC } from '../../../../constants'
+import { ACTION_TYPE_EVENT } from '../../../../PageAction'
 import { UniCustomElement } from '../components'
 
 export function patchEvent(el: UniCustomElement, name: string, flag: number) {
diff --git a/packages/uni-app-plus/src/view/framework/dom/elements/modules/style.ts b/packages/uni-app-plus/src/view/framework/dom/modules/style.ts
similarity index 100%
rename from packages/uni-app-plus/src/view/framework/dom/elements/modules/style.ts
rename to packages/uni-app-plus/src/view/framework/dom/modules/style.ts
diff --git a/packages/uni-app-plus/src/view/framework/dom/page.ts b/packages/uni-app-plus/src/view/framework/dom/page.ts
index 377072e9a21bf4e432bcdd923978167620ca66a8..eefe61992a8f792a50a681b521ee9bc6dca10878 100644
--- a/packages/uni-app-plus/src/view/framework/dom/page.ts
+++ b/packages/uni-app-plus/src/view/framework/dom/page.ts
@@ -1,3 +1,4 @@
+import { isString } from '@vue/shared'
 import {
   createScrollListener,
   CreateScrollListenerOptions,
@@ -6,7 +7,28 @@ import {
 } from '@dcloudio/uni-core'
 import { formatLog } from '@dcloudio/uni-shared'
 import { PageCreateData } from '../../../PageAction'
-import { createElement } from './elements'
+
+import { createBuiltInComponent } from './components'
+
+import { UniElement } from './elements/UniElement'
+import { UniNode } from './elements/UniNode'
+
+const elements = new Map<number, UniNode>()
+
+export function $(id: number) {
+  return elements.get(id) as UniElement
+}
+
+export function createElement(id: number, tag: string | number) {
+  let element: UniNode
+  if (isString(tag)) {
+    element = new UniElement(id, document.createElement(tag))
+  } else {
+    element = createBuiltInComponent(tag, id)
+  }
+  elements.set(id, element)
+  return element
+}
 
 export function onPageCreated() {}
 
diff --git a/packages/vite-plugin-uni/package.json b/packages/vite-plugin-uni/package.json
index ac39bdf68179c4ab28acf28781c4c1facc68f4ae..db81e1060df9125e6079e63d8d668ca4c1ee4de0 100644
--- a/packages/vite-plugin-uni/package.json
+++ b/packages/vite-plugin-uni/package.json
@@ -41,7 +41,7 @@
     "@types/sass": "^1.16.0"
   },
   "uni-app": {
-    "compilerVersion": "3.1.21"
+    "compilerVersion": "3.1.22"
   },
   "gitHead": "56deaeb47d42e924d10282d7af418ccee6b139bf"
 }