vue2 icon 组件

<template>
<!-- symbol 的形式 -->
<svg class="icon" aria-hidden="true">
<use :xlink:href="iconName"></use>
</svg>
</template>
<script>
// https://www.iconfont.cn/help/detail?spm=a313x.7781069.1998910419.d8cf4382a&helptype=code
// 搜索 symbol
import "../../assets/js/iconfont_weibao.js";
export default {
name: 'RIcon',
props: {
name: {
type: String,
required: true,
default: ''
}
},
computed: {
iconName: function(){
return `#icon-${this.name}`
}
}
}
</script>
<style type="text/css">
.icon {
width: 1em;
height: 1em;
vertical-align: -0.15em;
fill: currentColor;
overflow: hidden;
}
</style>