如何在vuejs中為輸入字段設置值

Question

<div class="col-md-8">
    <va-input label="Address 1"
        v-model="Address1"
        id="address"
        class="inp">
    </va-input>
</div>

下面我調用 api 來獲取數據。 得到后我需要將值設置為上面的輸入字段。

document.getElementById("address").value =res.data[0].address1,

但上面的代碼不起作用。

Answer 1

嘗試使用ref屬性，請參見此處： https ://v2.vuejs.org/v2/api/#ref 基本上看起來像：

    <va-input label="Address 1"
              v-model="Address1"
              id="address"
              class="inp"
              ref="inputRef"
    >
         </va-input>
    ...
    this.$refs.inputRef.$el.value = ...

您可能需要深入研究結構，但可以從$el訪問該元素。

Answer 2

您需要將此數據添加到組件的“數據”中，只需創建：

`data() {
    return {
        Address1: ''
    }
}`

並在created()或您要分配此值的任何地方： this.Adress1 = res.data[0].address1

基本上這是做這些事情的vue方式，並正確使用v-model。