PKTseng

<div id="app">
  <select v-model="number">
    <option disabled value="">select number</option>
    <option value="001">001</option>
    <option value="002">002</option>
    <option value="003">003</option>
  </select>
  <h1>{{number}}</h1>
</div>

PKTseng

<div id="app">
  <input type="radio" id="chk1" value="male" v-model="gender">
  <label for="chk1">male</label>

  <input type="radio" id="chk2" value="female" v-model="gender">
  <label for="chk2">female</label>

  <h1>{{gender}}</h1>
</div>

PKTseng

<div id="app">
  <h1>可以聯絡的時段:</h1>
  <input type="checkbox" id="chk1" value="8:00~12:00" v-model="times">
  <label for="chk1">morning</label>

  <input type="checkbox" id="chk2" value="13:00~ 18:00" v-model="times">
  <label for="chk2">afternoon</label>

  <input type="checkbox" id="chk3" value="19:00~21:00" v-model="times">
  <label for="chk3">evening</label>

PKTseng

<div id="app">
  <input type="checkbox" id="chk" v-model="agree">
  <label for="chk">agree</label>
  <h1>{{agree}}</h1>
  <button @click="submit">submit</button>
</div>

PKTseng

<div id="app">
  <input type="checkbox" id="chk" v-model="agree">
  <label for="chk">agree</label>
  <h1>{{agree}}</h1>
  <button @click="submit">submit</button>
</div>

PKTseng

<div id="app">
  <input type="checkbox" id="check" v-model="agree">
  <label for="check">agree</label>
  <h1>{{agree}}</h1>
  <button @click="submit">submit</button>
</div>

PKTseng

<div id="app">
  <input type="checkbox" id="check" v-model="agree">
  <label for="check">agree</label>
  <h1>{{agree}}</h1>
  <button @click="submit">submit</button>
</div>

PKTseng

<div id="app">
  <textarea @input="setMessage">{{message}}</textarea>
  <pre>{{message}}</pre>
</div>

PKTseng

<div id="app">
  <textarea :value="message" @input="setMessage">{{message}}</textarea>
  <pre>{{message}}</pre>
</div>

PKTseng

<div id="app">
  <textarea v-model="message"></textarea>
<!--   <h1>{{message}}</h1> -->
  <pre>{{message}}</pre>
</div>