在前端開發中，經常需要對表單輸入框進行限制，比如只允許輸入數字、只允許輸入正數等。在Vue中，可以通過v-model指令和相應的驗證函數來實現此功能。

<template>
<div>
<input v-model="num">
<button @click="submit">提交</button>
</div>
</template>
<script>
export default {
data() {
return {
num: ''
}
},
methods: {
submit() {
if(!(/^\d+$/.test(this.num))) {
alert('請輸入整數')
} else {
// 提交表單
}
}
}
}
</script>

在上面的代碼中，我們綁定了一個input輸入框，并通過v-model指令將其與數據num進行了綁定。同時，我們還定義了一個submit函數，用于驗證表單并提交。在表單驗證中，我們使用了JavaScript正則表達式的test方法，判斷輸入的內容是否為數字。如果不是數字，則彈出提示框；否則提交表單。

但是，這種方法還存在一個問題，就是用戶可以輸入小數點，而我們要求輸入整數。在此基礎上，我們可以使用一個自定義指令來限制用戶輸入。

<template>
<div>
<input v-model="num" v-integer>
<button @click="submit">提交</button>
</div>
</template>
<script>
export default {
data() {
return {
num: ''
}
},
directives: {
integer: {
bind(el) {
el.handler = function() {
el.value = el.value.replace(/[^\d]/g, '')
}
el.addEventListener('input', el.handler)
},
unbind(el) {
el.removeEventListener('input', el.handler)
}
}
},
methods: {
submit() {
// 提交表單
}
}
}
</script>

在上面的代碼中，我們定義了一個自定義指令v-integer，并在input輸入框中使用了它。在指令中，我們綁定了一個input事件，使用正則表達式將所有非數字字符替換為空字符串，從而達到限制用戶輸入整數的目的。

通過以上兩種方式，我們可以很方便地限制用戶輸入整數，并進行相應的驗證和提示。