需求:在项目中需要每隔五秒请求一次接口

第一种方法:直接在mounted钩子函数中处理

  mounted() {
window.setInterval(() => {
setTimeout(this.statusList(), 0);
}, 5000);
},

第二种方法:利用watch 去检测数据是否改变了

在data中定义一个变量 resultList:[]
在methos方法中 写一个方法
timer() {
return setTimeout(() => {
this.statusList(); //这个就是我的接口
}, 1000);
}, 在watch中检测
watch: {
resultList() {
this.timer();
}
}, 最后记得销毁 destroyed() {
clearTimeout(this.timer);
},

vue 项目中实时请求接口 建立长连接的更多相关文章

  1. Vue项目中使用Vuex + axios发送请求

    本文是受多篇类似博文的影响写成的,内容也大致相同.无意抄袭,只是为了总结出一份自己的经验. 一直以来,在使用Vue进行开发时,每当涉及到前后端交互都是在每个函数中单独的写代码,这样一来加大了工作量,二 ...

  2. Vue实例中封装api接口的思路 在页面中用async,await调用方法请求

    一般我们写小型的项目是用不到封装axios实例 但是当我们写大型项目时  接口有时候多到有上百个接口,那我们在请求一次调用一次接口,接口上好多都是重复的,这个时候我们就可以封装axios实例,既节省了 ...

  3. 在webpack搭建的vue项目中如何管理好后台接口地址

    在最近做的vue项目中,使用了webpack打包工具,以前在做项目中测试环境和生产环境的接口地址都是一样的,由于现在接口地址不一样,需要在项目打包的时候手动切换不同的地址,有时候忘记切换就要重新打包, ...

  4. 浅谈 Axios 在 Vue 项目中的使用

    介绍 Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中. 特性 它主要有如下特性: 浏览器端发起XMLHttpRequests请求 Node端发起http ...

  5. 在vue项目中使用axios发送FormData

    这个是axios的中文文档,挺详细的: https://www.kancloud.cn/luponu/axios/873153 文档中的    使用 application/x-www-form-ur ...

  6. vue 项目中,定时器(setInterval)的写法

    vue 项目中,定时器(setInterval)的写法: fetchJobList是一个方法,里面有dispatch一个action进行请求接口的代码. data () { return { inte ...

  7. vue项目中遇到的一些问题

    或访问:https://github.com/littleHiuman/experiences-about-vue  欢迎补充! vuex 状态 vue-cli 命令行 vue vue vue-rou ...

  8. 在vue项目中的axios使用配置记录

    默认vue项目中已经安装axios,基于element-ui开发,主要记录配置的相关. axiosConfig.js import Vue from 'vue' import axios from ' ...

  9. Vue项目中遇到的一些问题总结

    一.开发环境使用Ajax请求,报错  网上查的资料,在config中的index.js这样设置 proxyTable:{ '/api':{ target:'', //此处为你的API接口地址 chan ...

随机推荐

  1. Arraylist的源码学习

    @ 目录 ArrayList简介 ArrayList核心源码 ArrayList源码分析 System.arraycopy()和Arrays.copyOf()方法 两者联系与区别 ArrayList ...

  2. JavaScript学习系列博客_4_JavaScript中的数据类型

    JavaScript中有6种数据类型 一.基本数据类型 - String 字符串 JS中的字符串需要使用引号引起来双引号或单引号都行 但是要注意的是某种引号嵌套使用的话,需要加上 \ 转义.比如说我们 ...

  3. idea 推送jar包到maven私库

    1.推送到本地仓库 idea直接install即可 2.推送到公司私库 2.1 使用配置公司仓库地址的setting文件 <?xml version="1.0" encodi ...

  4. Jmeter+Ant+jenkins实现api自动化测试的持续集成

    0基础上手教程 @jmeter的使用 jmeter是一个基于java语言编写的开源测试工具,广泛应用于接口测试,性能测试,自动化测试. 接口自动化的编写教程,将于后续分享. 问题一:为什么用ant,而 ...

  5. Vue的Options

    el:挂载点 与$mount有替换关系 new Vue({ el: "#app" }); new Vue({}).$mount('#app') 注:被你选为挂载点的那个元素,如果在 ...

  6. Python全局变量的简单使用

    对Pyhon实现静态变量全局变量的方法详解 python不能像C++一样直接定义一个static变量或者通过extern来导入别的库的变量而实现数据共享,但是python的思想是通过模块化来解决这个问 ...

  7. 大牛浅谈Web测试基于实际测试的功能测试点总结

    今天跟大家讲解的是web测试在实际测试的功能测试点的一些小总结,希望对你们有帮助,有说的不好的地方,还请多多指教! 一.页面链接检查:测试每一个链接是否都有对应的页面,并且页面之前可以正确切换.   ...

  8. 23种设计模式 - 数据结构(Composite - iterator - Chain of Responsibility)

    其他设计模式 23种设计模式(C++) 每一种都有对应理解的相关代码示例 → Git原码 ⌨ 数据结构 Composite 动机(Motivation) 软件在某些情况下,客户代码过多依赖于对象容器复 ...

  9. 地图_SDK

    不仅仅是Google,您必须知道的全球十大地图API https://blog.csdn.net/u013068887/article/details/79322096

  10. python笔记-字符串连接

    字符串连接 + 1.Java中其他基本数据类型和string做+,自动转成string处理 Python中没有此特性.需要先转成string再做拼接 2.每连接一次,就要重新开辟空间,然后把字符串连接 ...