vue版本:3.x setup语法 + ts
涉及技术:h(),VNode,vue特殊attribute is
比如有一种情况,当前dom元素下要动态获取数据的展示某种组件,也就是说js部分不仅控制展示的文字内容,还要决定展示何种component,如何实现?
具体举一个🌰:
使用naive-ui的面包屑,而icon所采用的是xicons,xicons所引入的格式并不是常见的icon组件所使用一个string字段来表示name,而是直接引入一个component即vnode格式,如下截图可以看出:
实现效果:
这是模拟的一个面包屑列表数据结构:
import {
Accessibility, Alarm, AmericanFootballSharp } from "@vicons/ionicons5";
const breadcrumbList = [
{
name: "菜单1", icon: Accessibility },
{
name: "菜单2", icon: Alarm },
{
name: "菜单3"