warst/warst-h5/components/c-input-number/index.vue

<template>
	<!--  数字输入框 value也是number-->
	<u-input v-bind="__attrs" v-on="__listeners" ref="uInput">
		<template slot="prefix">
			<slot name="prefix"></slot>
		</template>

		<template slot="suffix">
			<slot name="suffix"></slot>
		</template>
	</u-input>
</template>
<script>
import uProps from 'uview-ui/components/u-input/props';

export default {
	name: 'cInputNumber',
	model: {
		prop: 'value',
		event: 'input',
	},
	props: {
		...uProps.props,
		type: {
			default: 'number',
			type: String,
		},
	},
	computed: {
		__attrs() {
			return {
				...this.$props,
				...this.$attrs,
				placeholder: this.$props.placeholder || '请输入',
			};
		},
		__listeners() {
			return {
				...this.$listeners,
				input: this.onInput,
				blur: this.onBlur,
				change: this.onChange,
			};
		},
	},
	methods: {
		onChange(val) {
			let numVal = val;
			if (this.type === 'number' && val) {
				numVal = +val; // 转number
			}
			this.$emit('change', numVal);
		},
		onInput(val) {
			let numVal = val;
			if (this.type === 'number' && val) {
				numVal = +val; // 转number
			}
			this.$emit('input', numVal);
		},
		onBlur(val) {
			let numVal = val;
			if (this.type === 'number' && val) {
				numVal = +val; // 转number
			}
			this.$emit('blur', numVal);
		},
	},
};
</script>