字符串中的 Vue mdi 图标

Question

我如何在字符串中使用 mdi 图标并 return 在一个方法中使用它作为 aggrid table 中单元格的一个组件 table。

import { mdiPencil } from "@mdi/js";
data(){
  return{
    mdiPencil
  }
}
methods:{
 viewButton() {
   return `<v-btn icon><v-icon>{{ mdiPencil }}</v-icon></v-btn>`;
 },
}

以上是我的方法。现在它在 aggrid table 单元格中将 {{mdiPencil}} 显示为字符串而不是图标。如何显示图标？

Answer 1

你可以试试

return `<svg role="img" class="v-icon__svg">
        <path d="${mdiPencil}"></path>
      </svg>`;

字符串中的 Vue mdi 图标

Vue mdi icons inside string

vue.js

ag-grid

mdi