index.js 2.0KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475
  1. import { VantComponent } from '../common/component';
  2. function emit(target, value) {
  3. target.$emit('input', value);
  4. target.$emit('change', value);
  5. }
  6. VantComponent({
  7. field: true,
  8. relation: {
  9. name: 'checkbox-group',
  10. type: 'ancestor',
  11. linked(target) {
  12. this.parent = target;
  13. },
  14. unlinked() {
  15. this.parent = null;
  16. }
  17. },
  18. classes: ['icon-class', 'label-class'],
  19. props: {
  20. value: Boolean,
  21. disabled: Boolean,
  22. useIconSlot: Boolean,
  23. checkedColor: String,
  24. labelPosition: String,
  25. labelDisabled: Boolean,
  26. shape: {
  27. type: String,
  28. value: 'round'
  29. }
  30. },
  31. methods: {
  32. emitChange(value) {
  33. if (this.parent) {
  34. this.setParentValue(this.parent, value);
  35. }
  36. else {
  37. emit(this, value);
  38. }
  39. },
  40. toggle() {
  41. const { disabled, value } = this.data;
  42. if (!disabled) {
  43. this.emitChange(!value);
  44. }
  45. },
  46. onClickLabel() {
  47. const { labelDisabled, disabled, value } = this.data;
  48. if (!disabled && !labelDisabled) {
  49. this.emitChange(!value);
  50. }
  51. },
  52. setParentValue(parent, value) {
  53. const parentValue = parent.data.value.slice();
  54. const { name } = this.data;
  55. const { max } = parent.data;
  56. if (value) {
  57. if (max && parentValue.length >= max) {
  58. return;
  59. }
  60. if (parentValue.indexOf(name) === -1) {
  61. parentValue.push(name);
  62. emit(parent, parentValue);
  63. }
  64. }
  65. else {
  66. const index = parentValue.indexOf(name);
  67. if (index !== -1) {
  68. parentValue.splice(index, 1);
  69. emit(parent, parentValue);
  70. }
  71. }
  72. }
  73. }
  74. });