iview table 渲染render数据中的多层嵌套写法

iview table 渲染render数据中的多层嵌套写法

参考iview树形渲染
render渲染数据后判断并修改成button样式

				 {
 						title: "状态",
                        key:"AS",
                        align: "center",
                        ellipsis: true,
                        tooltip: true,
                        render: (h, params) => {
                            return h(
                                "div",
                                {
                                    style: {
                                        padding: 0,
                                        boxSizing: "border-box"
                                    }
                                },
                                this.tableData[params.index].AS.map(item => {
                                    let a = item.states
                                    let type='error'
                                    if(a =='预警') type='warning'
                                    return h(
                                        "div",
                                        {
                                            style: {
                                                display: "block",
                                                padding: 0,
                                                margin: 0,
                                                height: "48px",
                                                lineHeight: "48px",
                                                textAlign: "center",
                                                fontSize: "14px",
                                                borderTop: "1px solid " + this.themaColor
                                            },
                                            slot: 'state'
                                        },
                                        // item.states
                                        [
                                            h("Button", {
                                                props: {
                                                    type: type,
                                                    size: 'small'
                                                }
                                            }, item.states)
                                        ]
                                    );
                                })
                            );
                        }
                    },