diff --git a/vue-components/button/package.json b/vue-components/button/package.json
index e1195f33..4c2b1255 100644
--- a/vue-components/button/package.json
+++ b/vue-components/button/package.json
@@ -1,5 +1,5 @@
 {
-  "version": "0.0.4",
+  "version": "0.0.5",
   "name": "@tmagic/vue-button",
   "type": "module",
   "main": "src/index.ts",
diff --git a/vue-components/button/src/formConfig.ts b/vue-components/button/src/formConfig.ts
index 22a9a517..689c5d92 100644
--- a/vue-components/button/src/formConfig.ts
+++ b/vue-components/button/src/formConfig.ts
@@ -17,6 +17,11 @@
  */
 
 export default [
+  {
+    name: 'className',
+    type: 'data-source-input',
+    text: 'class',
+  },
   {
     text: '文本',
     name: 'text',
diff --git a/vue-components/container/package.json b/vue-components/container/package.json
index 5a2d4102..1f115652 100644
--- a/vue-components/container/package.json
+++ b/vue-components/container/package.json
@@ -1,5 +1,5 @@
 {
-  "version": "0.0.6",
+  "version": "0.0.7",
   "name": "@tmagic/vue-container",
   "type": "module",
   "main": "src/index.ts",
diff --git a/vue-components/container/src/formConfig.ts b/vue-components/container/src/formConfig.ts
index 15b707ac..8afc103e 100644
--- a/vue-components/container/src/formConfig.ts
+++ b/vue-components/container/src/formConfig.ts
@@ -19,6 +19,11 @@
 import { getElById } from '@tmagic/core';
 
 export default [
+  {
+    name: 'className',
+    type: 'data-source-input',
+    text: 'class',
+  },
   {
     name: 'layout',
     text: '容器布局',
diff --git a/vue-components/img/package.json b/vue-components/img/package.json
index 78ade734..7ea4ad10 100644
--- a/vue-components/img/package.json
+++ b/vue-components/img/package.json
@@ -1,5 +1,5 @@
 {
-  "version": "0.0.4",
+  "version": "0.0.5",
   "name": "@tmagic/vue-img",
   "type": "module",
   "main": "src/index.ts",
diff --git a/vue-components/img/src/formConfig.ts b/vue-components/img/src/formConfig.ts
index 82926bdb..62e30616 100644
--- a/vue-components/img/src/formConfig.ts
+++ b/vue-components/img/src/formConfig.ts
@@ -17,6 +17,11 @@
  */
 
 export default [
+  {
+    name: 'className',
+    type: 'data-source-input',
+    text: 'class',
+  },
   {
     text: '图片',
     name: 'src',
diff --git a/vue-components/iterator-container/package.json b/vue-components/iterator-container/package.json
index bd786f65..342239f5 100644
--- a/vue-components/iterator-container/package.json
+++ b/vue-components/iterator-container/package.json
@@ -1,5 +1,5 @@
 {
-  "version": "0.0.4",
+  "version": "0.0.5",
   "name": "@tmagic/vue-iterator-container",
   "type": "module",
   "main": "src/index.ts",
diff --git a/vue-components/iterator-container/src/formConfig.ts b/vue-components/iterator-container/src/formConfig.ts
index b3cfcbef..5f0b34b2 100644
--- a/vue-components/iterator-container/src/formConfig.ts
+++ b/vue-components/iterator-container/src/formConfig.ts
@@ -18,6 +18,11 @@
 import { DATA_SOURCE_FIELDS_SELECT_VALUE_PREFIX, NODE_CONDS_KEY } from '@tmagic/core';
 
 export default [
+  {
+    name: 'className',
+    type: 'data-source-input',
+    text: 'class',
+  },
   {
     name: 'iteratorData',
     text: '数据源数据',
diff --git a/vue-components/page-fragment-container/package.json b/vue-components/page-fragment-container/package.json
index 078a355e..cc32fd79 100644
--- a/vue-components/page-fragment-container/package.json
+++ b/vue-components/page-fragment-container/package.json
@@ -1,5 +1,5 @@
 {
-  "version": "0.0.3",
+  "version": "0.0.4",
   "name": "@tmagic/vue-page-fragment-container",
   "type": "module",
   "main": "src/index.ts",
diff --git a/vue-components/page-fragment-container/src/formConfig.ts b/vue-components/page-fragment-container/src/formConfig.ts
index 3ba71aa2..756beec7 100644
--- a/vue-components/page-fragment-container/src/formConfig.ts
+++ b/vue-components/page-fragment-container/src/formConfig.ts
@@ -17,6 +17,11 @@
  */
 
 export default [
+  {
+    name: 'className',
+    type: 'data-source-input',
+    text: 'class',
+  },
   {
     name: 'pageFragmentId',
     text: '页面片ID',
diff --git a/vue-components/page/package.json b/vue-components/page/package.json
index 1768ce64..6ea075e1 100644
--- a/vue-components/page/package.json
+++ b/vue-components/page/package.json
@@ -1,5 +1,5 @@
 {
-  "version": "0.0.4",
+  "version": "0.0.6",
   "name": "@tmagic/vue-page",
   "type": "module",
   "main": "src/index.ts",
diff --git a/vue-components/page/src/formConfig.ts b/vue-components/page/src/formConfig.ts
index cdff7ddc..c2f4187e 100644
--- a/vue-components/page/src/formConfig.ts
+++ b/vue-components/page/src/formConfig.ts
@@ -28,7 +28,6 @@ export default [
   {
     text: '页面标题',
     name: 'title',
-    type: 'data-source-input',
   },
   {
     name: 'layout',
@@ -51,4 +50,33 @@ export default [
       }
     },
   },
+  {
+    name: 'jsFiles',
+    text: 'js',
+    type: 'table',
+    items: [
+      {
+        name: 'url',
+        label: '链接',
+      },
+    ],
+  },
+  {
+    name: 'cssFiles',
+    text: 'css',
+    type: 'table',
+    items: [
+      {
+        name: 'url',
+        label: '链接',
+      },
+    ],
+  },
+  {
+    text: 'css',
+    name: 'css',
+    type: 'code',
+    language: 'css',
+    height: '500px',
+  },
 ];
diff --git a/vue-components/page/src/index.vue b/vue-components/page/src/index.vue
index 42dbfdd6..261fc699 100644
--- a/vue-components/page/src/index.vue
+++ b/vue-components/page/src/index.vue
@@ -5,9 +5,31 @@
 <script lang="ts">
 import { defineComponent, type PropType } from 'vue-demi';
 
-import type { MPage } from '@tmagic/core';
+import { asyncLoadCss, asyncLoadJs, type MPage } from '@tmagic/core';
 import { useApp, useComponent } from '@tmagic/vue-runtime-help';
 
+const createCss = (config: MPage) => {
+  if (config.cssFile) {
+    asyncLoadCss(config.cssFile);
+  }
+
+  if (Array.isArray(config.cssFiles)) {
+    config.cssFiles.map((file) => asyncLoadCss(file.url));
+  }
+
+  if (config.css) {
+    const style = window.document.createElement('style');
+    style.innerHTML = config.css;
+    window.document.head.appendChild(style);
+  }
+};
+
+const createJs = (config: MPage) => {
+  if (Array.isArray(config.jsFiles)) {
+    config.jsFiles.map((file) => asyncLoadJs(file.url));
+  }
+};
+
 export default defineComponent({
   props: {
     config: {
@@ -30,6 +52,11 @@ export default defineComponent({
       methods: { refresh },
     });
 
+    if (app?.jsEngine === 'browser') {
+      createCss(props.config);
+      createJs(props.config);
+    }
+
     const containerComponent = useComponent({ componentType: 'container', app });
 
     return {
diff --git a/vue-components/qrcode/package.json b/vue-components/qrcode/package.json
index afa4c996..9a14466c 100644
--- a/vue-components/qrcode/package.json
+++ b/vue-components/qrcode/package.json
@@ -1,5 +1,5 @@
 {
-  "version": "0.0.3",
+  "version": "0.0.4",
   "name": "@tmagic/vue-qrcode",
   "type": "module",
   "main": "src/index.ts",
diff --git a/vue-components/qrcode/src/formConfig.ts b/vue-components/qrcode/src/formConfig.ts
index e5c4ef09..a14c98df 100644
--- a/vue-components/qrcode/src/formConfig.ts
+++ b/vue-components/qrcode/src/formConfig.ts
@@ -17,6 +17,11 @@
  */
 
 export default [
+  {
+    name: 'className',
+    type: 'data-source-input',
+    text: 'class',
+  },
   {
     text: '链接',
     name: 'url',
diff --git a/vue-components/text/package.json b/vue-components/text/package.json
index 7f930219..b951351f 100644
--- a/vue-components/text/package.json
+++ b/vue-components/text/package.json
@@ -1,5 +1,5 @@
 {
-  "version": "0.0.3",
+  "version": "0.0.4",
   "name": "@tmagic/vue-text",
   "type": "module",
   "main": "src/index.ts",
diff --git a/vue-components/text/src/formConfig.ts b/vue-components/text/src/formConfig.ts
index 2e86b78c..3bb9b153 100644
--- a/vue-components/text/src/formConfig.ts
+++ b/vue-components/text/src/formConfig.ts
@@ -17,6 +17,11 @@
  */
 
 export default [
+  {
+    name: 'className',
+    type: 'data-source-input',
+    text: 'class',
+  },
   {
     name: 'text',
     text: '文本',