index.js 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139
  1. import { VantComponent } from '../common/component';
  2. VantComponent({
  3. field: true,
  4. classes: ['input-class'],
  5. props: {
  6. icon: String,
  7. label: String,
  8. error: Boolean,
  9. fixed: Boolean,
  10. focus: Boolean,
  11. center: Boolean,
  12. isLink: Boolean,
  13. leftIcon: String,
  14. disabled: Boolean,
  15. autosize: Boolean,
  16. readonly: Boolean,
  17. required: Boolean,
  18. iconClass: String,
  19. clearable: Boolean,
  20. inputAlign: String,
  21. customClass: String,
  22. confirmType: String,
  23. confirmHold: Boolean,
  24. errorMessage: String,
  25. placeholder: String,
  26. customStyle: String,
  27. useIconSlot: Boolean,
  28. useButtonSlot: Boolean,
  29. showConfirmBar: {
  30. type: Boolean,
  31. value: true
  32. },
  33. placeholderStyle: String,
  34. adjustPosition: {
  35. type: Boolean,
  36. value: true
  37. },
  38. cursorSpacing: {
  39. type: Number,
  40. value: 50
  41. },
  42. maxlength: {
  43. type: Number,
  44. value: -1
  45. },
  46. type: {
  47. type: String,
  48. value: 'text'
  49. },
  50. border: {
  51. type: Boolean,
  52. value: true
  53. },
  54. titleWidth: {
  55. type: String,
  56. value: '90px'
  57. }
  58. },
  59. data: {
  60. showClear: false
  61. },
  62. beforeCreate: function beforeCreate() {
  63. this.focused = false;
  64. },
  65. methods: {
  66. onInput: function onInput(event) {
  67. var _this = this;
  68. var _ref = event.detail || {},
  69. _ref$value = _ref.value,
  70. value = _ref$value === void 0 ? '' : _ref$value;
  71. this.set({
  72. value: value,
  73. showClear: this.getShowClear(value)
  74. }, function () {
  75. _this.$emit('input', value);
  76. _this.$emit('change', value);
  77. });
  78. },
  79. onFocus: function onFocus(event) {
  80. var _ref2 = event.detail || {},
  81. _ref2$value = _ref2.value,
  82. value = _ref2$value === void 0 ? '' : _ref2$value,
  83. _ref2$height = _ref2.height,
  84. height = _ref2$height === void 0 ? 0 : _ref2$height;
  85. this.$emit('focus', {
  86. value: value,
  87. height: height
  88. });
  89. this.focused = true;
  90. this.set({
  91. showClear: this.getShowClear()
  92. });
  93. },
  94. onBlur: function onBlur(event) {
  95. var _ref3 = event.detail || {},
  96. _ref3$value = _ref3.value,
  97. value = _ref3$value === void 0 ? '' : _ref3$value,
  98. _ref3$cursor = _ref3.cursor,
  99. cursor = _ref3$cursor === void 0 ? 0 : _ref3$cursor;
  100. this.$emit('blur', {
  101. value: value,
  102. cursor: cursor
  103. });
  104. this.focused = false;
  105. this.set({
  106. showClear: this.getShowClear()
  107. });
  108. },
  109. onClickIcon: function onClickIcon() {
  110. this.$emit('click-icon');
  111. },
  112. getShowClear: function getShowClear(value) {
  113. value = value === undefined ? this.data.value : value;
  114. return this.data.clearable && this.focused && value && !this.data.readonly;
  115. },
  116. onClear: function onClear() {
  117. var _this2 = this;
  118. this.set({
  119. value: '',
  120. showClear: this.getShowClear('')
  121. }, function () {
  122. _this2.$emit('input', '');
  123. _this2.$emit('change', '');
  124. _this2.$emit('clear', '');
  125. });
  126. },
  127. onConfirm: function onConfirm() {
  128. this.$emit('confirm', this.data.value);
  129. }
  130. }
  131. });