forms.html 1.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849
  1. <form id="forms">
  2. <input type="text" name="text" v-model="text">
  3. <input type="checkbox" name="checkbox" v-model="checked">
  4. <input type="radio" name="radio" v-model="radio" value="a">
  5. <input type="radio" name="radio" v-model="radio" value="b">
  6. <select v-model="select" name="select">
  7. <option>a</option>
  8. <option>b</option>
  9. </select>
  10. <select id="multi" v-model="multipleSelect" name="multi" multiple>
  11. <option>a</option>
  12. <option>b</option>
  13. <option>c</option>
  14. <option>d</option>
  15. </select>
  16. <textarea name="textarea" v-model="textarea">more {{text}}</textarea>
  17. </form>
  18. <div id="values">
  19. <p class="text">{{text}}</p>
  20. <p class="checkbox">{{checked}}</p>
  21. <p class="radio">{{radio}}</p>
  22. <p class="select">{{select}}</p>
  23. <p class="multipleSelect">{{multipleSelect}}</p>
  24. <p class="textarea">{{textarea}}</p>
  25. </div>
  26. <script src="../../../dist/vue.js"></script>
  27. <script>
  28. var test = new Vue({
  29. el: 'body',
  30. lazy: true,
  31. data: {
  32. text: 'some text',
  33. checked: true,
  34. radio: 'b',
  35. select: 'b',
  36. multipleSelect: ['a','c'],
  37. textarea: undefined
  38. }
  39. })
  40. </script>