问题描述:

使用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. python 小兵(6)函数进阶

    阅读目录 函数参数-动态参数 名称空间 函数的嵌套 gloabal.nonlocal 回到顶部 函数参数-动态参数 之前我们说过传参,如果我们在传参数的时候不很清楚有哪些的时候,或者说给一个函数传了很 ...

  2. plsql 储存过程 参数的传递方式?

    /* 存储过程 一.oracel存储过程 1.没有返回值 return 值: 2.用输出参数来代替返回值: 3.输出参数可以有多个 二.参数的传递方式 1. 按位置传递 2. 按名字传递 3.混合传递 ...

  3. ApacheCN C/C++ 译文集 20211201 更新

    笨办法学C 中文版 前言 导言:C的笛卡尔之梦 练习0:准备 练习1:启用编译器 练习2:用Make来代替Python 练习3:格式化输出 练习4:Valgrind 介绍 练习5:一个C程序的结构 练 ...

  4. JAVA多线程学习十五 - 阻塞队列应用

    一.类相关属性 接口BlockingQueue<E>定义: public interface BlockingQueue<E> extends Queue<E> { ...

  5. textarea自适应高(宽)度

    转载请注明来源:https://www.cnblogs.com/hookjc/ 方法一: <textarea rows=1 cols=40 style='overflow:scroll;over ...

  6. 创建spring boot项目并添加多个模块时,启动报 错误: 找不到或无法加载主类

          最近建个项目发现启动报,找不到或无法加载主类,想想肯定是自己配置出问题了,经过排查确实出问题了,(根pom中的bulid为移到子模块中去导致的),下面演示下正确的创建子模块的步奏 1. 创 ...

  7. mybatis中的#和$的使用规范

    MyBatis 中 #{} 和 ${} 的区别 1.在MyBatis 的映射配置文件中,动态传递参数有两种方式: (1)#{} 占位符 (2)${} 拼接符 2.#{} 和 ${} 的区别 (1) 1 ...

  8. Java中==、equals、hashCode的区别

    "=="是运算符,用来比较两个值.两个对象的内存地址是否相等: "equals"是Object类的方法,默认情况下比较两个对象是否是同一个对象,内部实现是通过& ...

  9. 在VMware上安装Linux虚拟机

    1.新建虚拟机 2.选择典型安装 3.点击稍后安装操作系统 4.选择类型和版本 5.选择一个英文路径 6. 7.调整硬件 8. 9. 10.选择第一项 11.选择中文 12.选择最小安装 13. 14 ...

  10. Solution -「多校联训」行列式

    \(\mathcal{Description}\)   Link.   给定 \(x,\{d_i\}_{i=1}^n,\{p_i\}_{i=2}^n,\{b_i\}_{i=2}^n,\{c_i\}_{ ...