如何在vuejs中为输入字段设置值答案

【问题标题】：how to set value to input field in vuejs如何在vuejs中为输入字段设置值
【发布时间】：2019-12-19 07:58:22
【问题描述】：

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

但上面的代码不起作用。

【问题讨论】：

这不是 vuejs 的方式。
更改模型值Address1，而不是直接操作dom。例如：this.Address1 = res.data[0].address1
Pavan，你有在data 字段中变量的 Address1 吗？

标签： javascript html vue.js

【解决方案1】：

尝试使用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 访问该元素。

【讨论】：

控制台登录$el 并查看您的确切位置，然后定位您需要的子元素

【解决方案2】：

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

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

在created() 或任何你想分配这个值的地方： this.Adress1 = res.data[0].address1

基本上这是做这些事情的vue方式，并正确使用v-model。

【讨论】：