问题描述:

使用Tree树形控件使用render-content渲染时return后报错或npm run dev时候报错,报错信息相同,如下:

问题分析:

renderContent函数中需要使用jsx语法,需要安装vue中的jsx的插件transform-vue-jsx才支持jsx的写法

解决方法:

1:安装相关依赖:

npm install babel-plugin-transform-vue-jsx
npm install babel-helper-vue-jsx-merge-props
npm install babel-plugin-syntax-jsx

2:配置插件:

在根目录下找到.babelrc文件,加入配置:

{
"plugins": ["transform-vue-jsx"]
}

如下图所示: 

3:再次运行npm run dev即可

ElementUI Tree树形控件renderContent return时报错的更多相关文章

  1. elementUI Tree 树形控件--官方文档

    一.基础用法基础的树形结构展示,props相当于一个对实体类对像 <template> <el-tree :data="data" :props="de ...

  2. vue+element-ui之tree树形控件有关子节点和父节点之间的各种选中关系详解

    做后端管理系统,永远是最蛋疼.最复杂也最欠揍的事情,也永远是前端开发人员最苦逼.最无奈也最尿性的时刻.蛋疼的是需求变幻无穷,如同二师兄的三十六般变化:复杂的是开发难度寸步难行,如同蜀道难,难于上青天: ...

  3. vue_elementUI_ tree树形控件 获取选中的父节点ID

    el-tree 的 this.$refs.tree.getCheckedKeys() 只可以获取选中的id 无法获取选中的父节点ID想要获取选中父节点的id;需要如下操作1. 找到工程下的node_m ...

  4. Element ui tree树形控件获取当前节点id和父节点id

    低版本Element ui tree树形控件获取当前节点id和父节点id的方法:点击查看 最新版本Element ui tree树形控件获取当前节点id和父节点id教程: 1.找到node_modul ...

  5. BootstrapBlazor实战 Tree树形控件使用(2)

    继续上篇实战BootstrapBlazor树型控件Tree内容, 本篇主要讲解整合Freesql orm快速制作数据库后台维护页面 demo演示的是Sqlite驱动,FreeSql支持多种数据库,My ...

  6. BootstrapBlazor实战-Tree树形控件使用(1)

    实战BootstrapBlazor树型控件Tree的使用, 以及整合Freesql orm快速制作数据库后台维护页面 demo演示的是Sqlite驱动,FreeSql支持多种数据库,MySql/Sql ...

  7. vue-element Tree树形控件通过id默认选中

    一.设置 1.给树形控件设置 ref="tree" node-key="id" 2.在获取数据的位置加上 this.$nextTick(() => { t ...

  8. Element ui 使用 Tree 树形控件

    使用树形控件需要映入 jsx才能运行链接:https://github.com/vuejs/babel-plugin-transform-vue-jsx#usage npm install\ babe ...

  9. easyui Tree树形控件的异步加载

    Tree控件 $('#partyOrgTree').tree({ checkbox: false, url: getDataUrl, onClick: function (node) { getDiv ...

随机推荐

  1. Hadoop支持LZO

    0. 环境准备 maven(下载安装,配置环境变量,修改sitting.xml加阿里云镜像)gcc-c++zlib-develautoconfautomakelibtool通过yum安装即可 yum ...

  2. java实现以docx格式导出

    直接上代码:Map<String, Object> dataMap = afterLoanReportService.exportReport(startDate, endDate);// ...

  3. Android Studio中添加对HttpClient的支持包

    感谢大佬:https://blog.csdn.net/gladiator0975/article/details/49177959 sdk6.0以后取消了HttpClient,设置android SD ...

  4. 如何修改TOMCAT的默认主页为你自己项目的主页

    感谢作者:xxs673076773 原文链接:https://www.iteye.com/blog/xxs673076773-1134805 (最合适的) 最直接的办法是,删掉tomcat下原有Roo ...

  5. uni showLoading 还有注意关闭 闭包, .finally

    uni.showLoading({ title:'正在提交...' }); let data = JSON.parse(JSON.stringify($this.sendData)); const r ...

  6. Java-基于JDK的动态代理

    原创:转载需注明原创地址 https://www.cnblogs.com/fanerwei222/p/11686615.html 简单的记录一下Java中自带动态代理的用法. 准备材料: 1.一个接口 ...

  7. ReactiveCocoa 学习资料

    之前就有听说,感觉很强大,ReactiveCocoa更加被Mattt Thompson大神称为开启一个新Objective-C纪元.所以觉得非常有学习的必要了. 一些很好的学习资料: Reactive ...

  8. 有关MVC设计模式 #DF

    模型(Model).视图(View).控制器(Controller) -- MVC是 Cocoa 中的一种行为模块,并且也是所有 Cocoa 设计模式中使用最多的.在程序中按照它们的角色来分类这些对象 ...

  9. k8s之Pod基础概念

    1. 资源限制 Pod是kubernetes中最小的资源管理组件,Pod也是最小化运行容器化应用的资源对象.一个Pod代表着集群中运行的一个进程.kubernetes中其他大多数组件都是围绕着Pod来 ...

  10. Tomcat服务部署及优化

    Tomcat 服务部署及优化 1.Tomcat简介 2.Tomcat 服务安装及部署 3.Tomcat虚拟主机配置 4.Tomcat 优化 1.Tomcat简介: 概述: Tomcat是Java语言开 ...