面包屑的分隔右箭头引入报错

Question

Answer 1

河畔一角 2022-06-21 12:17:44

确实不行，应该是官方有bug，我本地试了也不行。直接用separator=">"这样更简单

• 提问者 枫林_souvenir #1

  用setup函数return一下就好了。。。但是不知道具体原因
  export default{
  setup() {
      return {
        ArrowRight,
      }
    },
  }

• 曹雨sama 回复 提问者 枫林_souvenir #2

  确实，我试了一下。放入setup函数中返回，警告就可以避免
  import { ArrowRight } from '@element-plus/icons-vue'
  import { useRoute } from "vue-router"
  export default {
      name: "BreadCrumb",
      setup() {
          const route = useRoute()
          const breadList = route.matched
          console.log(breadList)
  
          return {ArrowRight, breadList}
      }
  }
  </script>

Answer 2

飞飞1956514 2024-01-01 20:56:47

main.js 中添加

import * as ELIcon from '@element-plus/icons-vue'

for(let iconName in ELIcon){

    app.component(iconName, ELIcon[iconName])

}

然后 BreadCrumb.vue 这样使用

<el-breadcrumb separator-icon="ArrowRight" >