前端博客不写页面效果都是耍流氓！在下面这样的一个简单页面，需要实现从用户列表跳转到黑名单页面，然后再跳回用户列表，要实现对用户列表刷新这样一个需求。总的来说，就是两个页面相互切换要实现刷新！

基本的代码如下 ：
其实，重点的那两句句：
v-if="activeName === 'userList'"

<template>
  <div id="container">
    <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
      <el-tab-pane label="用户列表" name="userList">
        <user-list v-if="activeName === 'userList'" />
      </el-tab-pane>
      <el-tab-pane label="黑名单" name="administrator">
        <black-list v-if="activeName === 'administrator'" />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import UserList from "@/views/user/listPage/BlackListSearch.vue";
import BlackList from "@/views/user/listPage/BlackList.vue";
export default {
  name: "UserData",
  components: {
    UserList,
    BlackList,
  },
  data() {
    return {
      activeName: "userList",
    };
  },
  methods: {
    handleClick(tab) {
      this.activeName = tab.name;
    },
  },
};
</script>

其实很简单，但考验基础。