Vue中v-model Input的值无法修改

项目需求：选择代付对象，其附属信息会在input中显示出来，但附属信息可以修改,然而在开发中，附属信息显示出来了，但并不能修改

附属信息的input绑定的是details的某一属性

el-input(v-model="details.target")

details在data内初始定义为{}

data () {
    return {
      details    : {}
    }

在代付对象修改的时候，赋值给details

getTargetDetails (v) {
          this.details.bankCode = v.bankCode
          this.details.bankCard = v.bankCard
          this.details.target = v.payee
          this.details.phone = v.phone
   }

这时候能显示附属信息，但附属信息不能修改

原因

Vue的响应式property必须在初始化的时候声明

所以在定义 details的时候，把相关属性一起写出来才是正确的做法

data () {
    return {
      details    : {
        target  : undefined,
        phone   : undefined,
        bankCode: undefined,
        bankCard: undefined
      }
    }