1,vue 如何点击按钮返回上一页呢?

这是vue挂载的范围html代码

<div @click="goOff()">返回</div>

下面是点击返回的方法

第一种只返回上一页

goOff(){
                this.$router.go(-1);
            },

第二种 返回上一页,如果没有上一页返回首页

    methods: {
back(){
if (window.history.length <= 1) {
this.$router.push({path:'/'})
return false
} else {
this.$router.go(-1)
}
}
},

2,下面介绍一点vue调取接口小知识

actAllProfit(){                //调取接口的函数
                var params = {};                //这是调取接口时的请求参数 明白点就是我们要传过去的参数
                var reqUrl = this.diviBaseUrl + '/bonuses/grossProfit';               //这是后台接口地址
                this.$http.get(reqUrl,{               //get方式发送请求
                    params: params           //把外面声明的参数传过去
                }).then((res)=>{   //巧妙运用箭头函数
                    if(!res){return;}
                    this.allProfit = res.Profit; //res就是后台返回的所有数据 前端需要接收并保存
                })
            }

vue 如何点击按钮返回上一页的更多相关文章

  1. vue项目中阻止浏览器返回上一页

    vue项目中在某个页面阻止浏览器返回上一页,适用移动端.PC端. 使用场景例如: 首页 与 A页面     来回跳转,那样点击浏览器返回时也会来回跳转,本想当页面在首页的时候就不再返回了,所以这个时候 ...

  2. hbuilder+vue单页应用打包成APP后退按钮返回上一页的问题

    APP打包工具:hbuilder 需要js包:mui.js ,引入方法https://www.cnblogs.com/v616/p/11290281.html 实现原理:在vue根组件App.vue监 ...

  3. form表单中button按钮返回上一页解决办法

    解决Form中button按钮不好用的问题解决办法. 方法一: 1.在Form表单标签中国增加一个属性,如下图,红框处 2.返回按钮样式 3.onclick方法需要跳转的页面,遮挡处为需要返回的页面 ...

  4. 用javascript实现禁止页面后退返回上一页的代码

    用javascript实现禁止页面后退返回上一页的代码:  有时候我们需要用户在点击了如下一步的按钮时,页面跳转到了下一个页面,这时想不允许用户返回后退到上一页,可以采用下面的方法:  在需要跳转的页 ...

  5. html实现返回上一页的几种方法(javaScript:history.go(-1);)

    html实现返回上一页的几种方法(javaScript:history.go(-1);) 一.总结: 1.javaScript:history.go(-1); 二.方法 1.通过超链接返回到上一页 & ...

  6. IOS 微信返回按钮事件控制弹层关闭还是返回上一页

    在微信公共号内绑定域名后或微信内打开第三方链接跳转非单页面网站时,经常会有弹层Modal的需求,此时如果用户习惯性点击微信自带的返回“<”按钮,就会跳转回上一页或退出网站,而为了避免这种不好的误 ...

  7. JS——BOM操作(点击按钮返回顶部案例:scrollTop的用法)

    点击按钮返回顶部案例: 代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta chars ...

  8. vue 实现返回上一页不请求数据keep-alive

    常规操作: 我们通常会将通过接口请求数据的方法放在==created== 或者 ==mounted==这两个生命周期中的一个里面调用. 但是我们知道,不管是我们刚进入这个页面还是从其他页面返回这个页面 ...

  9. 点击返回上一页 wx.navigateTo不管用了

    做跳转的时候,发现想返回上一页,但是这个上一页又是tab上的页面,返回不了怎么办呢 wx.navigateTo({ url: '../search/search', })   解决方法: wx.reL ...

随机推荐

  1. CSS面试细节整理(二)

    5.css盒模型: CSS 框模型 (Box Model) 规定了元素框处理元素内容.内边距.边框 和 外边距 的方式

  2. vscode设置

    通过ctrl+滚轮实现字体大小改变:在文件-->首选项-->设置-->用户设置中添加如下代码:"editor.mouseWheelZoom": true,

  3. ABP入门系列(2)——领域层创建实体

    ABP入门系列目录--学习Abp框架之实操演练 这一节我们主要和领域层打交道.首先我们要对ABP的体系结构以及从模板创建的解决方案进行一一对应.网上有代码生成器去简化我们这一步的任务,但是不建议初学者 ...

  4. 用R处理一组数据的三种方式

    USArrests是R附带的一个数据集,现在我们需要创建一个factor向量urbancat,如果UrbanPop列的某个值在中位数之上,就把urbancat对应位置的值设为1,否则设为0. 这种数据 ...

  5. PHP_DOC php文档结构及注解浏览

    项目中的PHP文件比较多,为了方便查看,使用PHP写了个小工具,可查看PHP文件的所有类.函数 和特定注释. 显示PHP文件的 Class 和 Function 显示 /// 开头的注解 显示 /// ...

  6. Web前端-Vue.js必备框架(四)

    Web前端-Vue.js必备框架(四) 计算属性: <div id="aaa"> {{ message.split('').reverse().join('') }} ...

  7. Java常用工具类练习题

    1.请根据控制台输入的特定日期格式拆分日期 如:请输入一个日期(格式如:**月**日****年) 经过处理得到:****年**月**日 提示:使用String的方法indexOf.lastIndexO ...

  8. Linux(Ubuntu) OpenGL 开发环境

    Linux(Ubuntu) OpenGL 开发环境 在 PC 平台上开发 OpenGL 可以使用的辅助工具有很多选择,这里我主要参考了 learnopengl 的配置,使用 GLFW 和 GLAD. ...

  9. Python中面向对象的概念(科普)

    面向对象(OOP)基本概念 面向对象编程 —— Object Oriented Programming 简写 OOP 目标 了解 面向对象 基本概念 01. 面向对象基本概念 我们之前学习的编程方式就 ...

  10. react-native学习(RN)--之Window环境下搭建环境配置,以及初始化建立react-native项目,(真机和模拟器运行的相关错误解决办法,android打包报错)

    react-native以后会更火的 一.安装java 二.安装Android Studio 三.安装react-native需要的Android studio额外部分 四.安装nodeJS  五.安 ...