index.js 1.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859
  1. 'use strict';
  2. Object.defineProperty(exports, '__esModule', { value: true });
  3. var component_1 = require('../common/component');
  4. var color_1 = require('../common/color');
  5. component_1.VantComponent({
  6. field: true,
  7. classes: ['node-class'],
  8. props: {
  9. checked: {
  10. type: null,
  11. observer: function (value) {
  12. var loadingColor = this.getLoadingColor(value);
  13. this.setData({ value: value, loadingColor: loadingColor });
  14. },
  15. },
  16. loading: Boolean,
  17. disabled: Boolean,
  18. activeColor: String,
  19. inactiveColor: String,
  20. size: {
  21. type: String,
  22. value: '30px',
  23. },
  24. activeValue: {
  25. type: null,
  26. value: true,
  27. },
  28. inactiveValue: {
  29. type: null,
  30. value: false,
  31. },
  32. },
  33. created: function () {
  34. var value = this.data.checked;
  35. var loadingColor = this.getLoadingColor(value);
  36. this.setData({ value: value, loadingColor: loadingColor });
  37. },
  38. methods: {
  39. getLoadingColor: function (checked) {
  40. var _a = this.data,
  41. activeColor = _a.activeColor,
  42. inactiveColor = _a.inactiveColor;
  43. return checked
  44. ? activeColor || color_1.BLUE
  45. : inactiveColor || color_1.GRAY_DARK;
  46. },
  47. onClick: function () {
  48. var _a = this.data,
  49. activeValue = _a.activeValue,
  50. inactiveValue = _a.inactiveValue;
  51. if (!this.data.disabled && !this.data.loading) {
  52. var checked = this.data.checked === activeValue;
  53. var value = checked ? inactiveValue : activeValue;
  54. this.$emit('input', value);
  55. this.$emit('change', value);
  56. }
  57. },
  58. },
  59. });