vue过滤器的使用

最新推荐文章于 2024-06-01 11:18:57 发布

goodStudy_H

最新推荐文章于 2024-06-01 11:18:57 发布

阅读量308

点赞数

本文链接：https://blog.csdn.net/goodStudy_H/article/details/97919933

版权

今天有个需求，产品说身份证号信息比较重要，让我把中间的数字用*代替。网上一搜，不错的代码，贴在这里。

网址附上，以示尊敬。https://segmentfault.com/q/1010000013590505

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Vue filters</title>
    <script src="https://cdn.jsdelivr.net/npm/vue"></script>
</head>
<body>
    <div id="app">
        <ul>
            <li v-for="item in ID">{{item | hideMiddle}}</li>
        </ul>
    </div>
    <script type="text/javascript">
        new Vue({
            el: '#app',
            data: {
                ID: [
                "1234567897897","5648754542132"]
            },
            methods: {            
            },
            filters: {
                hideMiddle(val) {
                    return `${val.substring(0,3)}****${val.substring(val.length-3)}`
                }
            }
        })
    </script>
</body>
</html>

我的效果图：

代码：

<el-table-column
   label="身份证号"
   align="center"
   width="180">
   <template slot-scope="scope">
      <span>{{scope.row.idcard | hideMiddle}}</span>
   </template>
</el-table-column>

filters: {
      hideMiddle(val) {
        return `${val.substring(0, 3)}*******${val.substring(val.length - 4)}`
      }
    },

goodStudy_H

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫