vue中onclick怎么实现组件跳转

在Vue中实现组件跳转可以使用`router-link`组件或者编程式导航。

1. 使用`router-link`组件：
在模板中使用`<router-link>`标签，并设置`to`属性为目标组件的路径，点击该链接时会自动进行路由跳转。

   <template>
     <div>
       <router-link to="/target-component">跳转到目标组件</router-link>
     </div>
   </template>

2. 使用编程式导航：
在组件的方法中使用`$router.push()`方法来进行跳转，传入目标组件的路径作为参数。

   methods: {
     goToTargetComponent() {
       this.$router.push('/target-component');
     }
   }

在模板中，可以通过调用该方法来触发组件的跳转。

   <template>
     <div>
       <button @click="goToTargetComponent">跳转到目标组件</button>
     </div>
   </template>

以上两种方法都可以实现组件之间的跳转。如果你使用了Vue Router来管理路由，推荐使用`router-link`组件来实现跳转，它更简洁且易于维护。如果需要在代码中动态控制跳转，可以使用编程式导航。