index.js 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990
  1. import { isPresetColor } from '../helpers/colors'
  2. Component({
  3. externalClasses: ['wux-class', 'wux-input-class'],
  4. options: {
  5. multipleSlots: true,
  6. },
  7. properties: {
  8. type: {
  9. type: String,
  10. value: 'checkbox',
  11. },
  12. value: {
  13. type: String,
  14. value: '',
  15. },
  16. defaultChecked: {
  17. type: Boolean,
  18. value: false,
  19. },
  20. checked: {
  21. type: Boolean,
  22. value: false,
  23. observer(newVal) {
  24. if (this.data.controlled) {
  25. this.updated(newVal)
  26. }
  27. },
  28. },
  29. disabled: {
  30. type: Boolean,
  31. value: false,
  32. },
  33. color: {
  34. type: String,
  35. value: 'balanced',
  36. observer(newVal) {
  37. this.setData({
  38. inputColor: isPresetColor(newVal),
  39. })
  40. },
  41. },
  42. controlled: {
  43. type: Boolean,
  44. value: false,
  45. },
  46. wrapStyle: {
  47. type: String,
  48. value: '',
  49. },
  50. },
  51. data: {
  52. inputChecked: false,
  53. inputColor: '',
  54. },
  55. methods: {
  56. updated(inputChecked) {
  57. if (this.data.inputChecked !== inputChecked) {
  58. this.setData({
  59. inputChecked,
  60. })
  61. }
  62. },
  63. onChange() {
  64. const { value, inputChecked, disabled, controlled } = this.data
  65. const item = {
  66. checked: !inputChecked,
  67. value,
  68. }
  69. if (disabled) return
  70. if (!controlled) {
  71. this.updated(!inputChecked)
  72. }
  73. this.triggerEvent('change', item)
  74. },
  75. },
  76. attached() {
  77. const { defaultChecked, checked, controlled } = this.data
  78. const inputChecked = controlled ? checked : defaultChecked
  79. const inputColor = isPresetColor(this.data.color)
  80. this.setData({
  81. inputChecked,
  82. inputColor,
  83. })
  84. },
  85. })