antd vue中 为本省略Ellipsis异常,TypeError: Cannot read property 'map' of undefined

antd vue中 为本省略Ellipsis异常,TypeError: Cannot read property ‘map’ of undefined

问题描述

在使用Ellipsis标签的时候,有时会出现前端异常,如下:
TypeError: Cannot read property 'map' of undefined
代码如下:
// 前面已经引入Ellipsis组件
    {
      title: '进场备注',
      dataIndex: 'remark',
      customRender: (text) => {
        return (
          <div>
            {text === null ? ' '
              : <Ellipsis length={36} tooltip>{text}</Ellipsis>
            }
          </div>
        )
      }
    },

问题分析

这个问题出现的原因是因为,文本省略中的text是null或者undefined,
取不到值,所以报错。造成这个问题的原因有一下几点:
1. 值本时就是空,以上为为例,就是remark是空,但是我此处判断了是否为空。
2. 后端传递给前端的值中,没用有remark这个参数,所以此时他传递到ellipsis里面时
    是个undefined,所有会报错,我这里并没有判断这种情况,所以报错。

解决方案

此处我是在后端加入了remark字段。
或者也可以在text === null 加上 && text === undefined

猜你喜欢

转载自blog.csdn.net/weixin_43141746/article/details/104904077