Vue表格中手机号码的隐藏与分组

1、隐藏中间四位

//prop对应表格数据中的对象的字段名
<el-table-column prop="phone" width="110" label="联系电话"><template slot-scope="scope">{{scope.row.phone?scope.row.phone.replace(/(\d{3})(\d{4})(\d{4})/,"$1****$3"):""}}</template>
</el-table-column>

效果：

2、按3-4-4分组

<el-table-column prop="phone" width="110" label="联系电话"><template slot-scope="scope">{{scope.row.phone?scope.row.phone.replace(/(\d{3})(\d{4})(\d{4})/,"$1-$2-$3"):""}}</template>
</el-table-column>

效果：

Vue表格中手机号码的隐藏与分组相关推荐

Vue表格中，对数据进行转换、处理
众所周知,后端从Mysql取出的数据,一般是很难单独处理某一个Key的数据的(需要处理的话,可能会浪费大量的性能.而且对页面加载时间有很大的影响),所以,从数据库取出的数据.只能由前端进行处理.但是在 ...
Vue项目中手机号码验证
Vue项目中手机号码验证输入错误的号码,弹出提示窗口! 输入正码的手机号,显示倒计时: 标签这样写: 工具方法:
ant design vue 表格中时间戳转换成时间格式显示
ant design vue 表格中时间戳转换成时间格式显示原始数据表格如上图,因为接口传递过来的时间是10位int类型的时间戳格式,所以前端需要我们把时间格式化. step1 安装moment n ...
office2019选框虚线_怎么在word表格中显示和隐藏表格中的虚线框
我们知道word中的表格虚线框打印出来是不会显示的,使用虚框的目的就是让我们更能直观的对数据进行编辑和排版,使用word的用户在制作表格的时候都会用虚线框来进行一个简单的排版设置,接下来看看在word ...
Ant Design of Vue表格中slot-scope=“text, record”
1.需求:单元格中的内容需要循环渲染,如图 2.后台返回的数据格式为: 3.刚开始使用的是这样: <template slot="conditionsArr" slot-sc ...
Vue elementui中侧边栏滚动条隐藏
小小的记录下今天遇到的问题在写vue后台管理系统的时候,侧边栏菜单太多,导致有滚动条出现,所以就显得不是很好看标签 <el-aside> </el-aside> css样式 ...
word表格中如何查看隐藏线
边框--查看网格线隐藏线就可见了
VUE 表格中显示状态的列颜色圆点+文字/颜色圆点+鼠标操作两种表现方式
鼠标悬停在色块上显示提示框 VUE代码(element-UI): <el-table-column prop="status" label="状态" he ...
关于el-popover在表格中既打不开也关不上的问题
el-popover很好用,但是它确有很大的问题一.最普通的运用 <el-popover placement="top" width="270" v-m ...

Vue表格中手机号码的隐藏与分组

Vue表格中手机号码的隐藏与分组相关推荐

最新文章

热门文章