// svg展示，用于左侧菜单图标展示
<template>
	<svg :class="style['svg-icon']" aria-hidden="true">
		<use :xlink:href="symbolId" :fill="color" />
	</svg>
</template>

<script>
import { defineComponent, computed } from 'vue'
import style from './base-svg-icon.module.less'
export default defineComponent({
	name: 'BaseSvgIcon',
	props: {
		prefix: {
			type: String,
			default: 'icon',
		},
		name: {
			type: String,
			required: true,
		},
		color: {
			type: String,
			default: '#333',
		},
	},
	setup(props) {
		const symbolId = computed(() => `#${props.prefix}-${props.name}`)
		return { symbolId, style }
	},
})
</script>