vue echarts 柱状图表,点击柱子,路由代参数(X轴坐标)跳转

myChart.on('click', (params) => {
                     if (params.componentType === 'series' && params.dataIndex !== undefined) {
                           const months = this.month_htqd[params.dataIndex]; // 获取点击柱状图的 X 轴坐标值
                          alert(`点击了柱状图,值为: ${months}`);
                         // 根据点击的柱状图数据索引,处理跳转逻辑
                          this.$router.push( {
                            path: `/tzmanager/yueding`,
                            query: {
                                yuedTime: months
                              }
                            });
                      }
                  });

data () {
      return {
        queryParam: {
          yuedTime: '' // 初始化为空,接收选择的月份值
        },
     },
     mounted() {
        this.queryParam.yuedTime =this.$route.query.yuedTime;
    }
}

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-07-19 18:38:01       67 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-07-19 18:38:01       71 阅读
  3. 在Django里面运行非项目文件

    2024-07-19 18:38:01       58 阅读
  4. Python语言-面向对象

    2024-07-19 18:38:01       69 阅读

热门阅读

  1. Python打包exe 以及压缩大小方法

    2024-07-19 18:38:01       21 阅读
  2. 【ELK】简述

    2024-07-19 18:38:01       19 阅读
  3. 架构以及架构中的组件

    2024-07-19 18:38:01       16 阅读
  4. MySQL物理备份-XtraBackup远程备份恢复

    2024-07-19 18:38:01       19 阅读
  5. 学术资源网站

    2024-07-19 18:38:01       24 阅读
  6. MySQL 删除重复记录

    2024-07-19 18:38:01       19 阅读