【问题标题】:Error in ag-grid-vue Could not find component XXX, did you forget to configure this component?ag-grid-vue 报错 找不到组件 XXX,是不是忘记配置这个组件了?
【发布时间】:2022-02-20 04:59:28
【问题描述】:

我正在使用 ag-grid-vue,我正在尝试创建自定义工具提示。

这是我的代码:

CustomToolTipVue.js 组件:

export default {
  template: `
      <div class="custom-tooltip" v-bind:style="{ backgroundColor: color }">
          <p><span>{{ data.athlete }}</span></p>
          <p><span>Country: </span>{{ data.country }}</p>
          <p><span>Total: </span>{{ data.total }}</p>
      </div>
    `,
  data: function () {
    return {
      color: null,
      athlete: null,
      country: null,
      total: null,
    };
  },
  beforeMount() {
    this.data = this.params.api.getDisplayedRowAtIndex(
      this.params.rowIndex
    ).data;
    this.color = this.params.color || 'white';
  },
};

网格组件 - 我在哪里使用它(仅附上主要代码):

<script>
import { AgGridVue } from "ag-grid-vue";
import "ag-grid-community";
import CustomToolTipVue from './CustomToolTipVue.js'

export default {
  name: "Grid",
  data: () => ({
    gridOptions: null,
    gridApi: null,
    gridColumnApi: null,
    selectedRows: [],
    noRowsTemplate: "",
    loadingTemplate: "",
    rowClassRules:null
  }),
  components: {
    AgGridVue,
    CustomToolTipVue
  },
  created() {
    this.gridOptions = {};
    this.gridOptions.columnDefs = this.columnDefs;
    this.gridOptions.components = {
    };
  },
  computed: {
    defaultColDef() {
      return {
        resizable: true,
        menuTabs: ["filterMenuTab", "generalMenuTab", "columnsMenuTab"],
        sortable: true,
        filter: true,
        tooltipComponentParams: { color: '#ececec' },
        tooltipComponent: "CustomToolTipVue",
      };
    },
  },

我不断收到此错误:

“找不到组件CustomToolTipVue,你忘了配置这个组件吗?”

知道为什么吗?

【问题讨论】:

    标签: vue.js ag-grid ag-grid-vue


    【解决方案1】:

    设法通过将 ag-grid 升级到最新版本来解决它 - 27.0.0

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2018-03-10
      • 2020-06-21
      • 2020-08-24
      • 2020-06-08
      • 2019-03-08
      • 2023-03-27
      • 2018-11-17
      • 2018-06-12
      相关资源
      最近更新 更多