vue给组件绑定自定义事件无效怎么解决,vue在什么情况下需要用到自定义事件?
本文主要为大家介绍Vue组件的自定义事件，有一定的参考价值。感兴趣的朋友可以参考一下，希望能帮到你。
目录
摘要
模板
差异
h2{{msg}}/h2
！-将函数类型的数据从父组件传递到子组件props实现：子组件将数据传递到父组件-
学校：getName=getName/
学生：getStudentname= getStudentname /
！-通过父组件将自定义事件绑定到子组件：实现子组件向父组件传递数据-
年龄v-on:elderSex=demo/
！-通过父组件将自定义事件实现绑定到子组件：子组件将数据传递给父组件(第二种写法：使用ref) -
！-学生引用=学生/-
/div
/模板
脚本
从导入学校。/components/School.vue
从导入学生。/components/Student.vue
从导入年龄。/components/Age.vue
导出默认值{
名称：“应用程序”，
组件：{学校，学生，年龄}，
data(){
返回{
味精：“你好，世界！”
}
},
方法：{
getName(name){
Console.log(App接收名称，名称)；
},
getStudentname(name1){
Console.log(收到学生姓名，name 1)；
},
演示(性1){
Console.log( demo被调用，sex 1)；
}
},
//mounted() {
//绑定自定义事件
//这个。$refs.student.$on(elderSex ，this.schoolAge)
//绑定自定义事件(一次性)
//这个。$refs.student.$once(elderSex ，this.schoolAge)
//},
}
/脚本
样式范围
/风格
模板
div class=demo
H2学生姓名：{{name}}/h2
H2学生年龄：{{age}}/h2
Button @ click= sendStudentname 将学生的名字输入应用程序/按钮
/div
/模板
脚本
导出默认值{
姓名：学生，
道具：[getStudentname]，
data() {
返回{
姓名：张三，
年龄：19岁
}
},
方法：{
sendstudenname(){
this.getStudentname(this.name)
}
}
}
/脚本
风格。演示{
背景色：天蓝色；
}
/风格
总结
本文到此为止。希望能帮到你，也希望你能多关注我们的更多内容！
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。