vue如何解决循环引用组件报错的问题


Posted in Javascript onSeptember 22, 2018

问题由来

最近在做项目的时候遇到使用循环组件,因为模式一样,只有数据不一样。按照普通组件调用格式来做的时候总是报错,错误信息为[Vue warn]: Unknown custom element: <selfile> - did you register the component correctly? For recursive components, make sure to provide the "name" option.

解决方案

查询了网上各种资料之后,发现是循环调用组件时,组件比vue实例后创建,官方文档里写组件必须先于实例化引入,所以说组件没有正确的引入。

解决方式

解决的方式就是全局引入组件,并且在vue实例化前。

具体到我们项目中,就是在main.js里引入。

具体代码如下main.js:

import Vue from 'vue'
import App from './App'
import router from './router'
import store from './store';
import iView from 'iview';
import './styles/index.less'
import {VTable,VPagination} from 'vue-easytable'
import 'vue-easytable/libs/themes-base/index.css'
import Axios from './utils/axiosPlugin'
import './styles/button.css'
import './styles/common.css'
// require('./mock/mock')
import selFile from './views/file/selFile.vue'

Vue.use(iView);
Vue.use(Axios);

Vue.component(VTable.name, VTable)
Vue.component(VPagination.name, VPagination)
Vue.component("selFile",selFile)

Vue.config.productionTip = false

/* eslint-disable no-new */
new Vue({
 el: '#app',
 store,
 router,
 components: { App },
 template: '<App/>'
})

用上面的方法全局引入组件就可以解决循环引用组件报错的问题。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Javascript与vbscript数据共享
Jan 09 Javascript
出现“不能执行已释放的Script代码”错误的原因及解决办法
Aug 29 Javascript
Javascript remove 自定义数组删除方法
Oct 20 Javascript
跨域表单提交状态的变相判断代码
Nov 12 Javascript
jquery中获得$.ajax()事件返回的值并添加事件的方法
Apr 15 Javascript
avalon js实现仿微博拖动图片排序
Aug 14 Javascript
JavaScript知识点总结(十一)之js中的Object类详解
May 31 Javascript
JavaScript lodash常见用法系列小结
Aug 24 Javascript
JavaScript 中使用 Generator的方法
Dec 29 Javascript
JavaScript类数组对象转换为数组对象的方法实例分析
Jul 24 Javascript
vue el-table实现自定义表头
Dec 11 Javascript
JS co 函数库的含义和用法实例总结
Apr 08 Javascript
开发一个Parcel-vue脚手架工具(详细步骤)
Sep 22 #Javascript
angular的输入和输出的使用方法
Sep 22 #Javascript
vue构建动态表单的方法示例
Sep 22 #Javascript
小程序实现展开/收起的效果示例
Sep 22 #Javascript
玩转vue的slot内容分发
Sep 22 #Javascript
vue 巧用过渡效果(小结)
Sep 22 #Javascript
vue forEach循环数组拿到自己想要的数据方法
Sep 21 #Javascript
You might like
木翼下载系统中说明的PHP安全配置方法
2007/06/16 PHP
PHP _construct()函数讲解
2019/02/03 PHP
关于Laravel参数验证的一些疑与惑
2019/11/19 PHP
JavaScript语言中的Literal Syntax特性分析
2007/03/08 Javascript
JavaScript CSS修改学习第二章 样式
2010/02/19 Javascript
广泛收集的jQuery拖放插件集合
2012/04/09 Javascript
在Javascript中 声明时用&quot;var&quot;与不用&quot;var&quot;的区别
2013/04/15 Javascript
JavaScript实现简单的时钟实例代码
2013/11/23 Javascript
判断javascript的数据类型(示例代码)
2013/12/11 Javascript
jquery自定义函数的多种方法
2014/01/09 Javascript
基于jQuery实现表格内容的筛选功能
2016/08/21 Javascript
微信+angularJS的SPA应用中用router进行页面跳转,jssdk校验失败问题解决
2016/09/09 Javascript
通过BootStrap实现轮播图的实际应用
2016/09/26 Javascript
微信小程序 setData的使用方法详解
2017/04/20 Javascript
JavaScript原生实现观察者模式的示例
2017/12/15 Javascript
react-redux中connect的装饰器用法@connect详解
2018/01/13 Javascript
20行JS代码实现粘贴板复制功能
2018/02/06 Javascript
深入理解JavaScript 中的执行上下文和执行栈
2018/10/23 Javascript
用js简单提供增删改查接口
2019/05/12 Javascript
vue.js实现备忘录demo
2019/06/26 Javascript
vue请求数据的三种方式
2020/03/04 Javascript
零基础写python爬虫之神器正则表达式
2014/11/06 Python
将python代码和注释分离的方法
2018/04/21 Python
python 批量添加的button 使用同一点击事件的方法
2019/07/17 Python
ipad上运行python的方法步骤
2019/10/12 Python
python实现布隆过滤器及原理解析
2019/12/08 Python
Django+RestFramework API接口及接口文档并返回json数据操作
2020/07/12 Python
完美实现CSS垂直居中的11种方法
2021/03/27 HTML / CSS
《一件运动衫》教学反思
2014/02/19 职场文书
消防安全员岗位职责
2014/03/10 职场文书
物理教育专业求职信
2014/06/25 职场文书
园林技术专业求职信
2014/07/28 职场文书
幼儿教师师德师风演讲稿
2014/08/22 职场文书
浅谈tf.train.Saver()与tf.train.import_meta_graph的要点
2021/05/26 Python
Python 处理表格进行成绩排序的操作代码
2021/07/26 Python
Java比较两个对象中全部属性值是否相等的方法
2021/08/07 Java/Android