<template> <van-cell title="淘麦VIP|会员中心" is-link value="首次授权即送100积分，马上授权" /> <van-cell-group > <van-cell title="我的服务" /> </van-cell-group> <!-- <van-grid> <van-grid-item icon="./img/icon1.png" text="我的订单" /> <van-grid-item icon="photo-o" text="观演人" /> <van-grid-item icon="photo-o" text="收货地址" /> <van-grid-item icon="photo-o" text="评价" /> </van-grid> --> <van-grid :column-num="5"> <van-grid-item v-for="value in 11" :key="value" icon="photo-o" text="我的订单" /> </van-grid> <van-tabs @click="onClickTab"> <van-tab title="标签 1">动态</van-tab> <van-tab title="标签 2">想看&想玩</van-tab> </van-tabs> </template> <script> import { ref } from 'vue'; import { showToast } from 'vant'; export default { data(){ return{ active:'', onClickTab:'', } }, methods: { setup() { this.active = ref(0); this.onClickTab = ({ title }) => showToast(title); } } } </script> <style> </style> 为什么onClickTab 方法没有效果

在代码中，onClickTab 方法没有被正确地挂载到组件实例上，这是因为它没有被定义在 methods 对象中。正确的做法是将 onClickTab 方法定义在 methods 对象中，例如：

export default {
  data() {
    return {
      active: '',
    }
  },
  methods: {
    onClickTab({ title }) {
      showToast(title)
    },
  },
}

同时，需要注意的是，在 setup 方法中不需要定义 data 和 methods，因为它们已经被 Vue 3 Composition API 替代。如果想要在组件中使用 Composition API，可以使用 `setup` 方法，但不需要再定义 data 和 methods。