javascript - 如何在模板中使用 $refs - vuejs

Question

我有一个属性为“ref”的输入，我不想使用 v-model

<div class="form-group m-b-40">
  <input type="text" class="form-control" id="name" ref="name"  required> 
</div>
 {{showInput}}

我想自动显示我的输入值。我这样做

 methods: {
       showInput: function () {
            this.$refs.name.value
        },
    }

但它没有更新。

Answer 1

因为 ref 的 value 不是可观察对象，除非它绑定(bind)到组件实例:

data() {
    return {
        name: ''
    }
}

然后给你的输入一个:value="name"，现在它有一个观察者附加到它