路由文件meta中iconSvgIcon组件的使用

在路由文件中，可以使用meta字段来添加一些额外的信息，如页面标题、页面描述、页面关键字等。如果需要在页面中添加一个 SVG 图标，可以使用iconSvgIcon组件。

具体使用步骤如下：

1. 在项目中创建一个 SVG 图标文件，可以使用在线 SVG 编辑器创建，也可以使用第三方 SVG 图标库下载。

2. 将 SVG 图标文件放到项目中的某个目录下，比如 public 目录下的 icons 文件夹。

3. 在路由文件中的meta字段中添加iconSvgIcon属性，属性值为SVG图标文件的路径，相对于public目录的路径。

示例代码如下：

{
  path: '/home',
  name: 'Home',
  component: Home,
  meta: {
    title: '首页',
    iconSvgIcon: '/icons/home.svg'
  }
}

4. 在组件中引用iconSvgIcon组件，在组件中通过`$route.meta.iconSvgIcon`获取SVG图标文件的路径，然后渲染SVG图标。

示例代码如下：

<template>
  <div>
    <h1>{{ $route.meta.title }}</h1>
    <icon-svg-icon :icon="$route.meta.iconSvgIcon" />
  </div>
</template>

<script>
import IconSvgIcon from '@/components/IconSvgIcon.vue'

export default {
  components: {
    IconSvgIcon
  }
}
</script>

以上就是在路由文件meta中使用iconSvgIcon组件的方法。