vue中实现定时刷新页面以及菜单定时自动跳转

1、在mixins文件下新建mixinsMenu.js

import { mapGetters } from 'vuex'
import {getStore} from '@/utils/store'

const boardMixins={
  computed:{
    ...mapGetters(['pageIndex']),
    userInfo(){
      return getStore({name: 'userInfo'})
    }
  },
  created(){
    this.initData()
    this.initTimer()
    this.setPageChage()
  },
  data(){
    return {
      timer:null,//定时器
    }
  },
  methods: {
    // 5秒刷新数据
    initTimer(){
      this.timer = setInterval(()=>{
        this.initData()
      },5000)
    },
    //翻页,根据路由配置顺序翻页
    setPageChage(){
        let times = 120000
        //总页数
        let {pageIndex} = this;
        let menus = getStore({name: 'menus'});
        let pageUrls = [];
        if(menus&&menus.length>0){
          pageUrls = menus[0].children
        }
        
        if(pageUrls.length>1){
          setTimeout(()=>{
            pageIndex++
            if(pageIndex>=pageUrls.length){
              pageIndex = 0
            }
            this.$store.commit('SET_PAGE_INDEX',pageIndex);
            this.$router.push(pageUrls[pageIndex].path)
            clearInterval(this.timer)
          },times)
          }
      })
    },

  },
};
export default mixinsMenu;

2、在页面中引入mixinsMenu

import mixinsMenu from '../mixins/mixinsMenu'
export default{
  name:'',
  mixins: [mixinsMenu],
  methods: {
    // 初始化数据
    initData(){
      this.getData()
      this.getList()
    },
    getData(){
      //请求数据
    },
    getList(){
      //请求数据
    },
  }
}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

~犇犇~

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值