动态使用element-plus 的图标

一般情况下使用el-icon：

<el-icon :size="20">
    <House />
 </el-icon>

动态渲染使用：

<el-icon :size="20">
	<template v-for="(item, index) in icons" :key="index">
		<el-icon :color="item.color" :size="item.size">
    		<component :is="item.name"></component>
    	</el-icon>
    </template>
 </el-icon>

export default {
    
    
	data() {
    
    
        return{
    
    
            icons: [
                {
    
    
                    name: "House",
                    color: "#409EFC",
                    size: 20,
                },
                {
    
    
                    name: "Plus",
                    color: "",
                    size: 24,
                },
                {
    
    
                    name: "FullScreen",
                    color: "#f89898",
                    size: ""
                }
            ]
        }
    },
}

效果：