vue.js - vue工程，引入第三方UI库失败，浏览器提示Unknown custom element，为神马？

问题描述

问 题

使用vue官方脚手架搭建的工程，引入了radon，一个第三方UI库。已经import了，并注册了component，但依然无法渲染，浏览器提示：vue.common.js?e881:1019 [Vue warn]: Unknown custom element: <rd-button> - did you register the component correctly? For recursive components, make sure to provide the "name" option.。

各组件代码如下：

main.js

 import Vue from 'vue'
    import App from './App'
    import Bootstrap from 'bootstrap/dist/css/bootstrap.min.css'
    import { RadonInstall } from 'radon-ui'

Vue.use(RadonInstall)

/* eslint-disable no-new */

new Vue({
  el: 'body',
  components: { App }
})

App.vue

<template>
  <div id="app">
    <my-table></my-table>
  </div>
</template>

<script>
import MyTable from './components/Table'

export default {
  components: {
    MyTable
  }
}
</script>

Table.vue

<script>
import { rdButton } from 'radon-ui'

export default {
  data () {
    return {
      components: {
        rdButton
      }
    }
  }
}
</script>

求大神指点。

解决方案

不是在data里声明components好吧…

这篇关于vue.js - vue工程，引入第三方UI库失败，浏览器提示Unknown custom element，为神马？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！