vue --- > 子组件监听点击事件,接收父组件参数.实现对应跳转

开始

• vue中子组件这一块,有点麻烦。不是说它很难,而是它的传送数据方式,以及和各种前端后端路由混在一起时,如果不清晰很容易就迷茫
• 下面假设:
• 路由配置文件为:router.js
• 父组件为 parent.vue , 路径为 ./parent.vue
• 子组件1为 child1.vue, 路径为 ./child1.vue
• 子组件2为 child2.vue, 路径为 ./child2.vue
• 父组件中,使用child1.vue循环生成了一堆卡片,点击每个卡片,跳到对应的卡片详情中去.
• 从这里开始

// parent.vue
<template>
<div class="row">
  <div class="col" v-for="(item, index) in whatever" :key="index">
    <child1 :id = "item.id"></child1>
  </div>
</div>
</template>

<script>
import child1 from './child1.vue'

export default{
  data() {
    whaterver: [....]
  },
  components:{
    child1
  }
}
</script>

• 子组件

// child1
<template>
  <div @click="goTochild2"> 子组件1 </div>
</template>
<script>
export default{
  p