ruoyi-miniapp/wxcomponents/vant/search/index.js

import {
	VantComponent
} from '../common/component';
import {
	canIUseModel
} from '../common/version';
VantComponent({
	field: true,
	classes: ['field-class', 'input-class', 'cancel-class'],
	props: {
		value: {
			type: String,
			value: '',
		},
		label: String,
		focus: Boolean,
		error: Boolean,
		disabled: Boolean,
		readonly: Boolean,
		inputAlign: String,
		showAction: Boolean,
		useActionSlot: Boolean,
		useLeftIconSlot: Boolean,
		useRightIconSlot: Boolean,
		leftIcon: {
			type: String,
			value: 'search',
		},
		rightIcon: String,
		placeholder: String,
		placeholderStyle: String,
		actionText: {
			type: String,
			value: '取消',
		},
		background: {
			type: String,
			value: '#ffffff',
		},
		maxlength: {
			type: Number,
			value: -1,
		},
		shape: {
			type: String,
			value: 'square',
		},
		clearable: {
			type: Boolean,
			value: true,
		},
		clearTrigger: {
			type: String,
			value: 'focus',
		},
		clearIcon: {
			type: String,
			value: 'clear',
		},
		cursorSpacing: {
			type: Number,
			value: 0,
		},
	},
	methods: {
		onChange(event) {
			if (canIUseModel()) {
				this.setData({
					value: event.detail
				});
			}
			this.$emit('change', event.detail);
		},
		onCancel() {
			/**
			 * 修复修改输入框值时，输入框失焦和赋值同时触发，赋值失效
			 * https://github.com/youzan/vant-weapp/issues/1768
			 */
			setTimeout(() => {
				if (canIUseModel()) {
					this.setData({
						value: ''
					});
				}
				this.$emit('cancel');
				this.$emit('change', '');
			}, 200);
		},
		onSearch(event) {
			this.$emit('search', event.detail);
		},
		onFocus(event) {
			this.$emit('focus', event.detail);
		},
		onBlur(event) {
			this.$emit('blur', event.detail);
		},
		onClear(event) {
			this.$emit('clear', event.detail);
		},
		onClickInput(event) {
			this.$emit('click-input', event.detail);
		},
	},
});