前端頁面刷新時,導航欄tab頁面保持刷新前的頁面


因樣式問題並沒有使用element tabs組件

<template>
    <!-- 導航切換 -->
   <div class="nav_change">
      <div
        class="item"
        :class="current == 0 ? 'active' : ''"
        @click="changeTab(0)"
      >
        崗位信息
      </div>
      <div
        class="item"
        :class="current == 1 ? 'active' : ''"
        @click="changeTab(1)"
      >
        收到的簡歷
      </div>
      <div
        class="item"
        :class="current == 2 ? 'active' : ''"
        @click="changeTab(2)"
      >
        面試邀請
      </div>
      <div
        class="item"
        :class="current == 3 ? 'active' : ''"
        @click="changeTab(3)"
      >
        投標企業
      </div>
      <!-- <div
        class="item"
        :class="current == 4 ? 'active' : ''"
        @click="changeTab(4)"
      >
        評價
      </div> -->
    </div>
    <!-- 崗位詳情 -->
    <PostInfo v-if="postShow"></PostInfo>
    <!-- 收到的簡歷 -->
    <ReceiveResume v-if="receiveShow"></ReceiveResume>
    <!-- 面試邀請 -->
    <Interview v-if="interviewShow"></Interview>
    <!-- 投標企業 -->
    <TenderEnterprise v-if="tenderShow"></TenderEnterprise>
</template>
<script>
import PostInfo from "./postInfo";
import ReceiveResume from "./receiveResume";
import Interview from "./interview";
import TenderEnterprise from "./tenderEnterprise";
export default {
  name: "rdetail",
  components: {
    PostInfo,
    ReceiveResume,
    Interview,
    TenderEnterprise
  },
  data() {
    return {
      current: 0,
      postShow: true, //崗位詳情
      receiveShow: false, //接收到的簡歷
      interviewShow: false, //面試邀請
      tenderShow: false //投標企業
      //   evaluationShow: false //評價
    };
  },
//路由守衛 判斷如果是從其他頁面跳轉的就把current等於0來定位到導航欄的第一個
  beforeRouteEnter(to, from, next) {
    console.log("to", to);
    console.log("from", from);
    if (from.path == "/recruitment/list") {
      localStorage.setItem("enterpriseNum", 0);
      next();
    } else {
      next();
    }
  },
  created() {},
  mounted() {
    this.current = localStorage.getItem("enterpriseNum");
    this.changeTab(this.current)  
  },
  methods: {
    //導航欄的切換事件
    changeTab(num) {
      this.current = num;
      //本地存儲
      localStorage.setItem("enterpriseNum", num);
      if (num == 0) {
        this.postShow = true;
        this.receiveShow = false;
        this.interviewShow = false;
        this.tenderShow = false;
        // this.evaluationShow = false;
      } else if (num == 1) {
        this.postShow = false;
        this.receiveShow = true;
        this.interviewShow = false;
        this.tenderShow = false;
        // this.evaluationShow = false;
      } else if (num == 2) {
        this.postShow = false;
        this.receiveShow = false;
        this.interviewShow = true;
        this.tenderShow = false;
        // this.evaluationShow = false;
      } else {
        this.postShow = false;
        this.receiveShow = false;
        this.interviewShow = false;
        this.tenderShow = true;
        // this.evaluationShow = false;
      }
    }
  }, 
};
</script>


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM