index.js 1.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  1. import { VantComponent } from '../common/component';
  2. import { canIUseModel } from '../common/version';
  3. VantComponent({
  4. field: true,
  5. classes: ['field-class', 'input-class', 'cancel-class'],
  6. props: {
  7. label: String,
  8. focus: Boolean,
  9. error: Boolean,
  10. disabled: Boolean,
  11. readonly: Boolean,
  12. inputAlign: String,
  13. showAction: Boolean,
  14. useActionSlot: Boolean,
  15. useLeftIconSlot: Boolean,
  16. useRightIconSlot: Boolean,
  17. leftIcon: {
  18. type: String,
  19. value: 'search',
  20. },
  21. rightIcon: String,
  22. placeholder: String,
  23. placeholderStyle: String,
  24. actionText: {
  25. type: String,
  26. value: '取消',
  27. },
  28. background: {
  29. type: String,
  30. value: '#ffffff',
  31. },
  32. maxlength: {
  33. type: Number,
  34. value: -1,
  35. },
  36. shape: {
  37. type: String,
  38. value: 'square',
  39. },
  40. clearable: {
  41. type: Boolean,
  42. value: true,
  43. },
  44. },
  45. methods: {
  46. onChange(event) {
  47. if (canIUseModel()) {
  48. this.setData({ value: event.detail });
  49. }
  50. this.$emit('change', event.detail);
  51. },
  52. onCancel() {
  53. /**
  54. * 修复修改输入框值时,输入框失焦和赋值同时触发,赋值失效
  55. * https://github.com/youzan/@vant/weapp/issues/1768
  56. */
  57. setTimeout(() => {
  58. if (canIUseModel()) {
  59. this.setData({ value: '' });
  60. }
  61. this.$emit('cancel');
  62. this.$emit('change', '');
  63. }, 200);
  64. },
  65. onSearch(event) {
  66. this.$emit('search', event.detail);
  67. },
  68. onFocus(event) {
  69. this.$emit('focus', event.detail);
  70. },
  71. onBlur(event) {
  72. this.$emit('blur', event.detail);
  73. },
  74. onClear(event) {
  75. this.$emit('clear', event.detail);
  76. },
  77. },
  78. });