Key.js 2.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113
  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  3. exports.__esModule = true;
  4. exports.default = void 0;
  5. var _utils = require("../utils");
  6. var _touch = require("../mixins/touch");
  7. var _loading = _interopRequireDefault(require("../loading"));
  8. var _DeleteIcon = _interopRequireDefault(require("./DeleteIcon"));
  9. var _CollapseIcon = _interopRequireDefault(require("./CollapseIcon"));
  10. var _createNamespace = (0, _utils.createNamespace)('key'),
  11. createComponent = _createNamespace[0],
  12. bem = _createNamespace[1];
  13. var _default = createComponent({
  14. mixins: [_touch.TouchMixin],
  15. props: {
  16. type: String,
  17. text: [Number, String],
  18. color: String,
  19. wider: Boolean,
  20. large: Boolean,
  21. loading: Boolean
  22. },
  23. data: function data() {
  24. return {
  25. active: false
  26. };
  27. },
  28. mounted: function mounted() {
  29. this.bindTouchEvent(this.$el);
  30. },
  31. methods: {
  32. onTouchStart: function onTouchStart(event) {
  33. // compatible with Vue 2.6 event bubble bug
  34. event.stopPropagation();
  35. this.touchStart(event);
  36. this.active = true;
  37. },
  38. onTouchMove: function onTouchMove(event) {
  39. this.touchMove(event);
  40. if (this.direction) {
  41. this.active = false;
  42. }
  43. },
  44. onTouchEnd: function onTouchEnd(event) {
  45. if (this.active) {
  46. // eliminate tap delay on safari
  47. // see: https://github.com/vant-ui/vant/issues/6836
  48. if (!this.slots('default')) {
  49. event.preventDefault();
  50. }
  51. this.active = false;
  52. this.$emit('press', this.text, this.type);
  53. }
  54. },
  55. genContent: function genContent() {
  56. var h = this.$createElement;
  57. var isExtra = this.type === 'extra';
  58. var isDelete = this.type === 'delete';
  59. var text = this.slots('default') || this.text;
  60. if (this.loading) {
  61. return h(_loading.default, {
  62. "class": bem('loading-icon')
  63. });
  64. }
  65. if (isDelete) {
  66. return text || h(_DeleteIcon.default, {
  67. "class": bem('delete-icon')
  68. });
  69. }
  70. if (isExtra) {
  71. return text || h(_CollapseIcon.default, {
  72. "class": bem('collapse-icon')
  73. });
  74. }
  75. return text;
  76. }
  77. },
  78. render: function render() {
  79. var h = arguments[0];
  80. return h("div", {
  81. "class": bem('wrapper', {
  82. wider: this.wider
  83. })
  84. }, [h("div", {
  85. "attrs": {
  86. "role": "button",
  87. "tabindex": "0"
  88. },
  89. "class": bem([this.color, {
  90. large: this.large,
  91. active: this.active,
  92. delete: this.type === 'delete'
  93. }])
  94. }, [this.genContent()])]);
  95. }
  96. });
  97. exports.default = _default;