事件名称与组件和道具一样，事件名称提供自动大小写转换。如果在camelCase子组件中触发了一个事件，您将能够向父组件添加一个kebabcase（以破折号分隔的名称）侦听器。this.$emit('myEvent')与props命名相同，当您使用DOM模板时，我们建议使用kebabcase事件监听器。如果您使用的是字符串模板，则此限制不适用。定义自定义事件可以通过emits选项在组件上定义发出的事件。app.component('custom-form',{emits:['inFocus','submit']})当emits选项中定义了原生事件（如点击）时，将使用组件中的事件代替本机事件侦听器设备。抛出事件的验证类似于props类型验证，如果使用对象语法而不是数组语法，则可以进行验证。为了添加验证，为事件分配了一个函数，该函数接收传递给$emit调用的参数并返回一个布尔值，指示事件是否有效。app.component('custom-form',{emits:{//无校验click:null,//校验提交事件submit:({email,password})=>{if(email&&password){returntrue}else{console.warn('Invalidsubmiteventpayload!')returnfalse}}},methods:{submitForm(){this.$emit('submit',{email,password})}}})v-modelevent默认情况下，vcomponent-model使用modelValue作为props和update:modelValuedone事件。我们可以通过将参数传递给v-model来修改这些名称：要同步的事件：app.component('my-component',{props:{title:String},emits:['update:title'],template:``})通过使用特定的道具和事件来定位多个v-model绑定的能力，就像我们之前在v-model参数中所做的那样正如我们在中了解到的，我们现在可以在单个组件实例上创建多个v-model绑定。每个v-model将同步到不同的道具，而无需在组件中添加额外的选项。app.component('user-name',{props:{firstName:String,lastName:String},emits:['update:firstName','update:lastName'],模板:``})处理v-model修改在2.X中，我们对组件v模型上的修饰符（如.trim）进行了硬编码支持。但是，如果组件可以支持自定义修饰符，它会更有用。在3.X中，添加到组件v-model的修饰符将通过modelModifiers属性提供给组件。v-model具有内置修饰符-.trim、.number和.lazy。但是，在某些情况下，您可能还需要添加自己的自定义修饰符。让我们举个例子：将提供的字符串的第一个字母大写。app.component('my-component',{props:{modelValue:String,modelModifiers:{default:()=>({})}}，发射：['update:modelValue']，模板：``,created(){console.log(this.modelModifiers)//{capitalize:true}}})现在我们已经设置了道具，我们可以检查modelModifiers对象键并编写一个处理程序来更改发出的值。在下面的代码中，每当元素触发输入事件时，我们都会将字符串大写。{{myText}}
constapp=Vue.createApp({data(){return{myText:''}}})app.component('my-component',{props:{modelValue:String,modelModifiers:{default:()=>({})}},emits:['update:modelValue'],方法：{emitValue(e){letvalue=e.target.valueif(this.modelModifiers.capitalize){value=value.charAt(0).toUpperCase()+value.slice(1)}this.$emit('update:modelValue',value)}},template:`
