diff --git a/packages/common/component/MetaContainer.vue b/packages/common/component/MetaContainer.vue
index a277942c22..be0e300b4f 100644
--- a/packages/common/component/MetaContainer.vue
+++ b/packages/common/component/MetaContainer.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <meta-list-items class="list" :optionsList="children">
+    <meta-list-items class="list" :optionsList="children" @dragEnd="dragEnd">
       <template #content="{ data }">
         <div class="item-text">
           <div class="tiny-input">
@@ -67,7 +67,21 @@ export default {
       useHistory().addHistory()
     }
 
-    return { children, addChildren, delChildren }
+    const dragEnd = (params = {}) => {
+      const { oldIndex, newIndex } = params?.moved || {}
+
+      if (oldIndex === undefined || newIndex === undefined) {
+        return
+      }
+
+      const list = schemaChildren
+      const spliceItem = list.splice(oldIndex, 1)
+
+      list.splice(newIndex, 0, ...spliceItem)
+      children.value = [...list]
+    }
+
+    return { children, addChildren, delChildren, dragEnd }
   }
 }
 </script>
diff --git a/packages/common/component/MetaListItems.vue b/packages/common/component/MetaListItems.vue
index bc526c31dc..92da0e0081 100644
--- a/packages/common/component/MetaListItems.vue
+++ b/packages/common/component/MetaListItems.vue
@@ -118,8 +118,8 @@ export default {
       emit('deleteItem', params)
     }
 
-    const dragEnd = () => {
-      emit('changeItem')
+    const dragEnd = (value) => {
+      emit('dragEnd', value)
     }
 
     const editItem = (params) => {