vue2中jsx语法糖使用elmentui el-tooltip组件

最新推荐文章于 2024-07-24 15:55:49 发布

书中自有妍如玉

最新推荐文章于 2024-07-24 15:55:49 发布

阅读量1.2k

点赞数 1

分类专栏：前端文章标签：前端 javascript 开发语言

本文链接：https://blog.csdn.net/qq_26695613/article/details/127998421

版权

前端专栏收录该内容

133 篇文章 6 订阅

订阅专栏

本文介绍了Vue中`render`函数的使用，特别是`createElement`函数在创建组件时的角色。通过示例展示了如何传递props、data和子节点来渲染自定义组件，如`el-tooltip`，并讨论了组件属性设置和内容注入的方法。

摘要由CSDN通过智能技术生成

h：函数的作用createElement

接收三个参数

param1可以是 String | Object | Function
第二个是数据对象。我们在这里主要包括：props, attrs, dom props, class 和 style....
param3代表子节点，可以是 String | Array

render(h){return h(组件名称,{
//组件的属性和数据如el-image的src属性
    props:{
        src:'url'
    }
},子组件数组)}

renderHeaderCell:function({row,column,rowIndex},h){
            const span = h('span', 'Ⅰ级（%）')
            return h('el-tooltip', {
                //如果要使用其他组件，将el-tooltip替换其他组件 列如：Esign  props:{imgid:params.row.imgId}//imgid是自定义的值
                props: {
                  placement:"top",
                  content: '等级Ⅰ：指标：≤风险筛选值。污染评价：污染风险低；',
                  zIndex: 9999,
                },
              },[span])
            
          }