index.vue 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  1. <template>
  2. <view class="box-data">
  3. <Nav title="首页"></Nav>
  4. <view class="border-item"></view>
  5. <enInput v-model="text" label="姓名"></enInput>
  6. <enSend v-model="phone" ref="enSendObj" @getCode="getCode"></enSend>
  7. <enCheckbox v-model="type" label="爱好" :checkboxData="checkboxData"></enCheckbox>
  8. <enRadio v-model="sex" label="性别" :radioData="radioData"></enRadio>
  9. <enSwitch v-model="status" label="状态" ></enSwitch>
  10. </view>
  11. </template>
  12. <script>
  13. import enInput from "components/en-input/en-input"
  14. import enSend from "components/en-send/en-send"
  15. import enCheckbox from "components/en-checkbox/en-checkbox"
  16. import enRadio from "components/en-radio/en-radio"
  17. import enSwitch from "components/en-switch/en-switch"
  18. export default {
  19. components: {
  20. enSwitch,
  21. enRadio,
  22. enCheckbox,
  23. enInput,
  24. enSend
  25. },
  26. data() {
  27. return {
  28. phone:'13900139001',
  29. text:'来自火星的你',
  30. type:['1'],
  31. sex:'1',
  32. status:1,
  33. // checkboxData:[{'id':'1','name':'足球'},{'id':'2','name':'篮球'},{'id':'3','name':'排球'},{'id':'4','name':'羽毛球'},{'id':'5','name':'乒乓球'},{'id':'6','name':'铅球'},{'id':'7','name':'棒球'},{'id':'8','name':'冰球'},{'id':'9','name':'网球'},{'id':'10','name':'乒乓球'}]
  34. checkboxData:[{'id':'1','name':'足球'},{'id':'2','name':'篮球'},{'id':'3','name':'排球'}],
  35. radioData:[{'id':'1','name':'男'},{'id':'2','name':'女'}]
  36. }
  37. },
  38. watch:{
  39. 'type':function (){
  40. console.log('new--------type',this.type)
  41. },
  42. 'phone':function (){
  43. console.log('new--------'+this.phone)
  44. },
  45. 'text':function (){
  46. console.log('new--------'+this.text)
  47. },
  48. 'status':function (){
  49. console.log('new--------'+this.status)
  50. }
  51. },
  52. mounted() {
  53. },
  54. methods: {
  55. getCode(){
  56. console.log('---------------------asdsa')
  57. this.text='abc'
  58. this.$refs.enSendObj.setCodeNum()
  59. },
  60. },
  61. }
  62. </script>
  63. <style lang="scss" scoped>
  64. .border-item{
  65. border-bottom: 2rpx solid #F0F0F0;
  66. }
  67. .box-data{
  68. padding: 32rpx 32rpx 0;
  69. background-color: #fff;
  70. }
  71. </style>