需求
需求:
除了拿到false,还要拿到v-for中的index
如何解决:
再使用一次父传子,:a="index" 将下标值传递给子组件 注意要加引号
<experts @handlerchange="ChangeV" :a="index"></experts>
在html页面直接{{a}}就可以使用props中的值,
在methods:{}中要通过this哦
this.$emit("handlerchange", [this.a, false]);
this.$emit()中的传递多个参数使用中括号哦
子组件
<template> <!-- 子组件 --> <div> <h2 @click="getcon">123--{{a}}</h2> </div> </template> <script> export default { props: ["a"], methods: { getcon() { this.$emit("handlerchange", [this.a, false]); } } }; </script>
父组件
<template> <div> <div v-for="(item,index) in arr" :key="index" class="box"> <h2>标题</h2> <p>{{item.name}}</p> <experts @handlerchange="ChangeV" :a="index"></experts> </div> </div> </template> <script> import experts from "../../../components/myExperts"; export default { data() { return { arr: [ { name: "张三", id: "1" }, { name: "张四", id: "2" }, { name: "王五", id: "3" } ] }; }, components: { experts }, methods: { ChangeV(meass) { console.log(meass); } } }; </script> <style scoped> .box { margin-top: 20px; } </style>