在vue中使用mvvm（model-view-viewModel）雙向繫結獲取表單資料。如果習慣原生操作dom的方式，可以使用vue的ref屬性來獲取表單的資料。

<template>
  <div id="app">
    <p>{{message}}</p>
    <input type="text"  v-model="message"/><br/>
　　<input type="text"  ref="userInfo"/>  //ref相當於原生操作dom的id
　　<button v-on:click="getInputValue()">獲取第二個表單裡的資料</button>
  </div>
</template>
<script>
  export default{
    name:'app',
    data(){
       return {
          message:'第一個input裡的內容'
       }
    },
    methods:{
　　　　getInputValue(){
　　　　　　console.log(this.$ref.userInfo);//獲取ref定義的dom節點
          //輸出結果： <input type="text" >
　　　　　　cossole.log(this.$ref.userInfo.value);//獲取dom節點的原生value值
       }
    }
  }
</script>

ref的作用就是用來獲取dom節點，上例中 this.$ref.userInfo就相當於一個原生js的dom物件，也可以操作別的屬性。