如上图所示,是一个利用antd制作的一个表格,现在讲微信里面的字段设置成掩码格式。
代码:
const columns = [
{
title: '用户编号',
dataIndex: 'originalId',
key: 'originalId',
width: 70,
},
{
title: '微信号',
dataIndex: 'wxCode',
key: 'wxCode',
width: 70,
render: (value) => <Input compact={true} value={value} disabled="false" type="password"/>
},
{
title: '是否有效',
dataIndex: 'status',
key: 'status',
width: 70,
render: (value) => ValidStatus.getTextFromValue(value)
},
{
title: '昵称',
dataIndex: 'nickname',
key: 'nickname',
width: 70
}
]
在微信字段出设置一个render,里面嵌入一个 input框。
然后清除掉 input的样式:
.ant-input {
width: 100%;
height: 28px;
border: 0px;
outline: none;
cursor: pointer;
background: transparent;
}