vue3 --- 엘-다이얼로그를 다시 실행하여 문제를 표시합니다.

연습에서 코드를보기 위해 그림에서 정말 말문이 막히는 문제를 만났습니다.

정말 언뜻보기에 잘못이 없습니다, 차 조금, 다른 큰 형제는 다른 REACTIVE를 사용하거나, 약간 재정의하거나, 아직 NEXT를 약간 업데이트하지 않으려 고한다고합니다.

해결 방법::ref="dialogFrom" :model="dialogFrom", 이 둘은 동일한 변수 이름을 사용할 수 없으므로 줄에서 이름을 다시 정의하세요!

const dialogFrom = reactive({
 name: '',
 address: '',
 email: '',
 age: ''
})
const handleEdit = (row) => {
 getByIdInfo(row.id).then((res) => {
 Object.assign(dialogFrom, res.data)
 open.value = true
 })
}
// 
 <el-dialog
 :open-delay="200"
 :close-on-click-modal="false"
 title=" 
 :model-value="open"
 width="700px"
 append-to-body
 >
 <el-form ref="dialogFrom" :model="dialogFrom" label-width="100px">
 <el-row>
 <el-col :span="12">
 <el-form-item label="name" prop="name">
 <el-input v-model="dialogFrom.name" clearable class="w-50 m-2" />
 </el-form-item>
 <el-form-item label="age" prop="age">
 <el-input v-model="dialogFrom.age" clearable class="w-50 m-2" />
 </el-form-item>
 </el-col>
 </el-row>
 </el-form>
 </el-dialog>