一个更简单的方法来传递大量的props

　　今天，我们来学习下Vue技术小册，用更简单的方式传递大量的props，事例使用Vue3来演示的，当然在Vue2中也适用，投入正题，假设我们有一个用户信息的组件，如下所示：templatep姓名：｛｛name｝｝p职业：｛｛job｝｝p爱好：｛｛hobby｝｝templatestylescopedstyle复制代码
　　该组件接收三个参数，分别是用户姓名、职业、以及爱好。在template中把对应的这三个字段值显示出来。然后再父组件中，引入User组件，声明一个userInfo对象，然后给User组件传入这三个参数，如下所示：templateUser：nameuserInfo。name：jobuserInfo。job：hobbyuserInfo。hobbytemplatestylescopedclangscssstyle复制代码
　　运行结果如下：
　　在这里如果给User组件传的参数不止3个，那么我们也需要在User组件上一个一个去定义吗？显然不怎么高效。
　　其实我们可以使用vbind来解决这个问题，它会自动地把所有属性自动绑定到组件作为props传递给该组件。vbind官方文档：cn。vuejs。orgapibuilti
　　改造后：UservbinduserInfo复制代码
　　运行，效果如下：
　　同理，如果User组件里有很多的事件要处理，我们也可以使用von来解决这个问题。首先，我们在User组件中自定义两个事件，当点击姓名和爱好时，向父组件发出updateUserName，updeteUserHobby事件，如下所示：templatepclickhandleUserName姓名：｛｛name｝｝p职业：｛｛job｝｝pclickhandleUserHobby爱好：｛｛hobby｝｝templatestylescopedstyle复制代码
　　在父组件中，我们接收这两个事件，并把参数打印出来：template！User：nameuserInfo。name：jobuserInfo。job：hobbyuserInfo。hobbyUservbinduserInfoupdateUserNamereceiverUserNameupdateUserHobbyreceiverUserHobbytemplatestylescopedclangscssstyle复制代码
　　运行，效果如下：
　　这里，跟props又存在同样的问题，如果User里面自定义的事件很多，我们外面you懒得一个一个写，那么就可以使用von来解决这种困境：templateUservbinduserInfovonuserEventHandlerstemplatestylescopedclangscssstyle复制代码
　　这里，我们定义了一个userEventHandlers对象，对象的属性名就是我们User组件发出的自定义事件名，最后使用von绑定了userEventHandlers。运行，效果如下：