【Vue】iview render 数据不显示也没报错

<div class="device-table-list">
<Table stripe :columns="columns" :data="getTableData(currentPage)" @on-row-click="markerTap($event)" :disabled-hover="true"></Table>
</div>

columns: [
{
title: "设施编号",
align: "center",
key: "sn",
width:110,
},
{
title: "设施名称",
align: "center",
key: "alias",
width:160,
},
{
title: "设施工艺",
align: "center",
key: "devtec",
width:140,
},
{
title: "设施处理量",
align: "center",
key: "devsize",
width:110,
},
{
title: "能耗",
align: "center",
key: "sum_energy",
width:90,
},
{
title: "流量",
align: "center",
key: "sum_flow",
width:90,
},
{
title: "状态",
key: "monitor_object_state",
align: "center",
width:90,
render: (h, params) => {
if(params.row.monitor_object_state==1 || params.row.monitor_object_state==2){
return "正常"
}else if (params.row.monitor_object_state==3){
return "异常"
}else {
return "离线"
}
console.log(monitor_object_state);
}
},
{
title: "操作",
align: "center",
key: "ckxq",
render: (h, params) => {
return params.row.ckxq = "查看详情";
}
},
],

【Vue】iview render 数据不显示也没报错

这样写不显示也不报错，实在找不出原因了。
或者有没有别的办法能够显示啊

回答

         render: (h, params) => {
            if(params.row.monitor_object_state==1 || params.row.monitor_object_state==2){
             return h('span', "正常")
            }else if (params.row.monitor_object_state==3){
              //return "异常"
              return h('span', "异常")
            }else {
              //return "离线"
              return h('span', "离线")
            }
            console.log(monitor_object_state);
          }

以前按注释的内容是可以直接显示的
然后现在要改成这样才会显示也不知道是什么问题
反正是解决了

render 返回的应该是一个虚拟 DOM 对象

兄dei，render函数的作用是创建虚拟dom，你这个返回值肯定是不行的啦。返回值一定是 return h(html标签, 属性对象(可省略)[Object], 子节点(可省略)[String|Array])。你先试试最简单的render('div', '详情')，这个会在对应列渲染出一个“详情”div。

测试可以显示

{
              title: "状态",
              key: "monitor_object_state",
              align: "center",
              width:90,
              render: (h, params) => {
                let value = ''
                if(params.row.monitor_object_state == 1 || params.row.monitor_object_state==2){
                  value = "正常"
                }else if (params.row.monitor_object_state==3){
                  value = "异常"
                }else {
                  value = "离线"
                }
                return h('div',value)
              }
            },
            {
              title: "操作",
              align: "center",
              key: "ckxq",
              render: (h, params) => {
                return h('div',"查看详情");
              }
            },

以上是 【Vue】iview render 数据不显示也没报错 的全部内容， 来源链接： utcz.com/a/83685.html

回到顶部