鍍金池/ 問答/HTML/ vue動態(tài)綁定模型失敗

vue動態(tài)綁定模型失敗

比如說

當(dāng)前這個(gè)vue組件下有一個(gè)變量key的值為tel，我想讓一個(gè)input組件根據(jù)這個(gè)key值的不同，綁定到不同的變量上，比如說key為tel這個(gè)字符串的時(shí)候，綁定到'create.form.'+key也就是綁定到create.form.key上。這就是動態(tài)綁定。請問一下vue中可以實(shí)現(xiàn)這種綁定嗎？

<Input :v-model="'create.form.'+a"></Input>

其中a是'tel'

甚至是

<Input :v-model="'create.form.tel'"></Input>

綁定之后，實(shí)際修改create.form.tel這個(gè)數(shù)據(jù)，并沒有反映在input輸入框中，說明沒有綁定上，請問一下原因是什么呢？vue不允許這樣綁定嗎？

回答
編輯回答
笑浮塵

你這樣子實(shí)際上綁定到一個(gè)字符串去了

<Input v-model="{{'create.form.'+a}}"></Input>
2017年2月19日 22:28
編輯回答
病癮

沒有這指令,而且為什么你input要大寫?。?/p>

clipboard.png

2018年8月20日 14:07
編輯回答
離人歸

直接v-model="create.form.tel" 不要用冒號

<input v-model="something">

其實(shí)只是

<input
  v-bind:value="something"
  v-on:input="something = $event.target.value">

的語法糖

2017年1月8日 23:41
編輯回答
舊時(shí)光

這個(gè)問題可以用computed，以下代碼

  <input v-model='com'>
  data () {
    return {
      type: 'a',
      form: {
        a: 123,
        b: 321
      }
    }
  },
  computed: {
    com () {
      return this.form[this.type]
    }
  },
  created () {
    setTimeout(() => {
      this.type = 'b'
    }, 1000)
  }

（為什么想動態(tài)改鍵而不是動態(tài)改值？

2018年8月21日 20:14