如何在vue.js中为输入字段设置值

时间:2019-12-19 07:58:22

标签: javascript html vue.js

<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,

但是上面的代码不起作用。

2 个答案:

答案 0 :(得分:0)

尝试使用ref属性,请参见此处:https://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中访问元素。

答案 1 :(得分:0)

您需要将此数据添加到组件的“数据”中, 只需创建:

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

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

基本上,这是完成这类事情并正确使用v模型的重要方法。