diff --git a/components/form-template/index.vue b/components/form-template/index.vue
index 647901e..7b47c4f 100644
--- a/components/form-template/index.vue
+++ b/components/form-template/index.vue
@@ -1,13 +1,14 @@
 <template>
   <template v-for="item in formItems" :key="item.title">
     <form-cell v-if="item.cellType === 'formCellItem'" v-bind="item" :form="form"
-      :disableChange="disabledMap[item.title]" @change="change" @addRule="addRule" />
+      :disableChange="isDisableChange(item)" @change="change" @addRule="addRule" />
   </template>
   <form-cell />
 </template>
 <script setup>
-import { computed, provide, ref } from 'vue';
+import { computed, provide, ref, watch } from 'vue';
 import verifyForm from './verify.js';
+import { collectAutoFillChanges } from './auto-fill.mjs';
 
 import FormCell from './form-cell/index.vue';
 // import CustomCell from './custom-cell/index.vue';
@@ -69,6 +70,21 @@ function change(data) {
   emits('change', data)
 }
 
+function isDisableChange(item) {
+  return Boolean(disabledMap.value[item.title] || item.readonly === true || item.readonly === 'true');
+}
+
+function syncAutoFill() {
+  const changes = collectAutoFillChanges(formItems.value, props.form);
+  changes.forEach(change);
+}
+
+watch(
+  () => [props.items, props.form],
+  syncAutoFill,
+  { deep: true, immediate: true }
+);
+
 function verify() {
   return verifyForm(props.items, rules.value, props.form)
 }
@@ -79,4 +95,4 @@ defineExpose({ verify })
 
 <style>
 @import './cell-style.css';
-</style>
\ No newline at end of file
+</style>