phone-input.js 1.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  1. // components/phone-input/phone-input.js
  2. import {
  3. imgServerUrl
  4. } from '../../config/config.js'
  5. import { testPhone } from '../../utils/util'
  6. Component({
  7. /**
  8. * 组件的属性列表
  9. */
  10. properties: {
  11. // 标题
  12. title: {
  13. type: String,
  14. value: ''
  15. },
  16. // 是否为登陆
  17. is_login: {
  18. type: Boolean,
  19. value: false
  20. }
  21. },
  22. /**
  23. * 组件的初始数据
  24. */
  25. data: {
  26. imgServerUrl: imgServerUrl,
  27. iphone: '', // 电话号码
  28. disabled: false, //样式控制
  29. focus: true
  30. },
  31. /**
  32. * 组件的方法列表
  33. */
  34. methods: {
  35. // 清除输入
  36. clear() {
  37. this.setData({
  38. iphone: ''
  39. })
  40. },
  41. // 手机号输入
  42. bindPhoneInput(e) {
  43. if (e.detail.value.length === 11) {
  44. const disabled = testPhone(e.detail.value)
  45. if (disabled) {
  46. this.setData({
  47. iphone: e.detail.value,
  48. disabled,
  49. focus: false
  50. })
  51. } else {
  52. wx.showToast({
  53. icon: 'none',
  54. title: '号码格式错误',
  55. })
  56. }
  57. } else {
  58. this.setData({
  59. disabled: false
  60. })
  61. }
  62. },
  63. // 发送验证码
  64. toSend() {
  65. const { iphone, disabled } = this.data;
  66. if (disabled) {
  67. this.triggerEvent('done', { phone: iphone })
  68. } else {
  69. wx.showToast({
  70. icon: 'none',
  71. title: '请输入正确的手机号',
  72. })
  73. }
  74. }
  75. }
  76. })