antd react list组件显示的内容样式错乱

list组件显示的内容被挤到其他地方 是因为显示的内容有一部分是undefined或者null，只要用其他东西代替空内容，格式就会变为正常

我这里是因为要显示一条数据，数据是在数组里面放着，

一部分数据是空数组直接判断数组长度就好，

一部分数组是有内容，但是我需要的内容是undefined，

把有内容的数组放到一个新数组里然后遍历，如果新数组长度>0直接显示，不然就显示没有

遇到相同的问题可以和我交流。

var tag = [];
		if(item.Ports.length>0 ){
			
			for(var i=0; i < item.Ports.length; i++){
				console.log(item.Ports[i].PublicPort)
				if(tag.indexOf(item.Ports[i].PublicPort)== -1 && item.Ports[i].PublicPort != undefined){
				tag.push(<Tag key={tag} color='blue' >{item.Ports[i].PublicPort}</Tag>);		
				}
			}
			if(tag.length >0){
				return tag
			}else{
				return <Tag color='blue'>没有开放端口</Tag>
			}
			
			
		}else{
			return <Tag color='blue'>没有开放端口</Tag>
		}