el-table el-table-column 操作el-table的单行数据的内容 实现手机号码中间4位*显示，操作el-table的单行数据的内容显示与隐藏

一、效果图如下：
1，刚开始直接手机号码全部脱敏显示：
2，点击按钮：显示号码后，显示该行的手机号码全部位数，其他不变：
3，刷新后，恢复原样：

二、后端代码实现，手机号码脱敏显示，主要代码如下：

三、前端代码实现：
1，先在data() {retrun{}}中,定义：
2，在el-table-column中，写上如下代码：

如图：3，添加上显示号码和隐藏号码按钮，使用：v-show来控制显示，代码如下：

            显示号码
            隐藏号码

4，在methods中写上showNumberTrue和showNumberFlase的方法，代码如下：

    showNumberTrue(scope){
      this.showNumberFlag=true
      this.showNumberFlagIndex=scope.$index
    },
    showNumberFlase(scope){
      this.showNumberFlag=false
      this.showNumberFlagIndex=scope.$index
    },

总结：实际上操作el-table的单行数据的内容主要通过showNumberFlag和showNumberFlagIndex 2个参数，和比较scope.$index(每一行的行数)和showNumberFlagIndex(记录操作的行数)的值来实现！