vue中用使用render函数

前言：

        render是比较常用的功能，比如在框架里面的table的时候经常会使用到，这里来说一说，这是使用了iview的Rate（星星打分）来说明效果

效果图：

实现代码：

{
          title: '难易度',
          // align: 'center',
          render:(h, params)=> {
            let type = params.row.difficulty;//params.row.difficulty==获取到的值
            let style={};
            let showText = '';
                style.float = 'left';//使打分星星和文字平行
                // style.height = '32px';//给文字加样式，让文字和星星居中
                style.lineHeight = '32px';//给文字加样式，让文字和星星居中
            if(type == 1){
                style.color = '#0B99AD';
                showText='简单';
            }else if(type == 2){
                style.color = '#0B99AD';
                showText='普通';
            }else if(type == 3){
                style.color = '#0B99AD';
                showText='困难';
            }
            return  h("div",[
                        h('Rate',{//星星打分效果
                          style:style,
                          attrs:{//页面绑定的事件
                              value:type,
                              count:3,
                              disabled:true
                          }
                        }),
                        h('div',{
                          style:style
                        },showText)
                  ])
          },
        },