iView中Table的column表头需要有上标出现的问题

现象描述：

        在使用iView界面组件的Table组件时，需要在表头里添加面积这个选项，代码概要如下

listcolumns: [{
    title: '面积(m2)',
    key: 'Mj',
    align: 'center'
}]

        结果如预期所示

        

        然后添加

listcolumns: [{
    title: '面积(m2)',
    key: 'Mj',
    align: 'center'
}]

        发现并没有什么用，猜想应该是在title内，应该是直接解析为字符串，而不是原生html代码（C#里有个@Html.Raw）

解决问题：

        参考iView官方文档，找到一个renderHeader的方式来实现渲染，于是写出整体，然后逐渐摸索（修改细节展示效果）

{
                    	title: '面积(m2)',
                        key: 'Mj',
                        type: 'html',
                        align: 'center',
                        className: 'zzrwMj_css',
                        renderHeader:(h,params)=>{
                        	return h('div', {style: {
										display: 'table',
										height: '23px'
					            	}},[
					        	h('span', 
					        		{style: {
					                	display: 'inline-block',
					                	overflow: 'hidden',
					                	textOverflow: 'ellipsis',
					                	whiteSpace: 'nowrap',
					                	lineHeight: '23px',
					                	display: 'auto'
					            	}
					        	}, '面积(m'), 
				        		h('sup',{style:{
				                	top: 8
				            	}},'2'),
					    		h('span',
					    			{style:{
					                	display: 'inline-block',
					                	overflow: 'hidden',
					                	textOverflow: 'ellipsis',
					                	whiteSpace: 'nowrap',
					                	lineHeight: '23px',
					                	display: 'auto'
					            	}},')')
                        	]);
                        }

        结果如下，成功

感想：

        思路和整体仅供参考，细节可以继续优化。对render函数的结构是一个很好的理解。

        我个人觉得可能有更简单的方式实现类似于平方米sup或者更多原生html，也希望大家能够指点。