1. Input Cursor display

// The cursor displays vue.directive ('focus'Inserted: {// Definition of instructionfunction (el) {
		let t = el.value
		el.value = ' '
		el.value = t
		el.focus()
	}
});
Copy the code

2. Enter only the specified number of decimal digits

<input type= “text” v-enter-float:2>

Ps: Indicates that only two decimal digits can be entered

// Only a specified number of digits can be entered. Vue.directive('enterFloat', {
	bind: function(el, binding) {
		el.handler = function() {
			if (binding.arg) {
				let str = el.value
				let len1 = str.substr(0, 1)
				letLen2 = str.substr(1, 1) // If the first digit is 0 and the second digit is not a dot, replace the dot with a numberif(str.length > 1 && len1 === 0 && len2 ! = ='. ') {STR = str.substr(1, 1)} // The first digit cannot be.if (len1 === '. ') {
					str = ' '} // Limit input to one decimal pointif (str.indexOf('. ') !== -1) {
					let str_ = str.substr(str.indexOf('. ') + 1)
					if (str_.indexOf('. ') !== -1) {
						str = str.substr(0, str.indexOf('. ') + str_.indexOf('. ') + 1)
					}
				}
				str = str.replace(/[^0-9\.]+/, ' ') // Limit the number of decimal placesif (str.indexOf('. ') !== -1) {
					str = str.slice(0, str.indexOf('. ') + parseInt(binding.arg) + 1)
				}
				el.value = str
			} else {
				el.value = el.value.replace(/\D+/, ' ')
			}
			el.dispatchEvent(new Event('input'// Trigger an input event to update the value of the V-model} el.adDeventListener ('keyup', el.handler)
	},
	unbind: function(el) {
		el.removeEventListener('keyup', el.handler)
	}
});
Copy the code

3. Enter only positive integers

// Only positive integers can be entered. Vue.directive('enterNumber', {
	bind: function(el) {
		el.handler = function() {
			el.value = el.value.replace(/\D+/, ' ')
			el.dispatchEvent(new Event('input'))
		}
		el.addEventListener('keyup', el.handler)
	},
	unbind: function(el) {
		el.removeEventListener('keyup', el.handler)
	}
});
Copy the code