函数修改 v-model

v-model 是 Vue.js 框架中非常常用的一个指令，它用于在表单控件或者组件上创建双向绑定。在实际开发中，有时候我们需要对 v-model 绑定的数据进行处理或者修改，这时候就需要使用到函数修改 v-model。

函数修改 v-model 的方法是通过在绑定 v-model 的表单控件或组件上添加一个事件监听器，当表单控件或组件的值发生变化时，触发该事件监听器中的处理函数对绑定的数据进行修改。

以下是一个例子，假设我们要在输入框中输入数字，但是用户输入的数字必须小于 10，如果用户输入的数字大于等于 10，则自动将输入框清空：

<template>
  <div>
    <input type="text" v-model="number" @input="handleInput" />
  </div>
</template>

<script>
export default {
  data() {
    return {
      number: ''
    }
  },
  methods: {
    handleInput(event) {
      if (event.target.value >= 10) {
        this.number = ''
      } else {
        this.number = event.target.value
      }
    }
  }
}
</script>

在上面的代码中，我们在输入框上添加了一个 `@input` 事件监听器，并绑定了一个名为 `handleInput` 的处理函数。当用户输入数字时，如果数字大于等于 10，则清空输入框；否则将用户输入的数字赋值给 `number` 这个数据属性。