choosePutUser.vue 1.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667
  1. <template>
  2. <view>
  3. <uni-check-list :listData="list"></uni-check-list>
  4. </view>
  5. </template>
  6. <script>
  7. import uniCheckList from '@/components/uni-check-list/uni-check-list.vue'
  8. export default {
  9. components: {
  10. uniCheckList
  11. },
  12. data() {
  13. return {
  14. list: [{
  15. value: 'USA',
  16. name: '美国'
  17. },
  18. {
  19. value: 'CHN',
  20. name: '中国',
  21. checked: 'true'
  22. },
  23. {
  24. value: 'BRA',
  25. name: '巴西'
  26. },
  27. {
  28. value: 'JPN',
  29. name: '日本'
  30. },
  31. {
  32. value: 'ENG',
  33. name: '英国'
  34. },
  35. {
  36. value: 'FRA',
  37. name: '法国'
  38. }
  39. ]
  40. }
  41. },
  42. methods: {
  43. // 改变checkbox的选中状态
  44. checkboxChange(e) {
  45. var items = this.items,
  46. values = e.detail.value;
  47. for (var i = 0, lenI = items.length; i < lenI; ++i) {
  48. const item = items[i]
  49. if(values.includes(item.value)){
  50. this.$set(item,'checked',true)
  51. }else{
  52. this.$set(item,'checked',false)
  53. }
  54. console.log(item,'--------------')
  55. }
  56. },
  57. submit(){
  58. console.log('-------tijiao')
  59. }
  60. }
  61. }
  62. </script>
  63. <style>
  64. </style>