关闭当前页签

Gjfdream

已于 2022-10-10 21:26:17 修改

阅读量1.5k

点赞数 1

分类专栏：自身遇到的问题文章标签： vue.js

于 2022-09-11 12:13:24 首次发布

本文链接：https://blog.csdn.net/Gjfdream/article/details/126804177

版权

Vue 路由管理页签关闭 $store.dispatch $router.replace

关键词由CSDN通过智能技术生成

自身遇到的问题专栏收录该内容

4 篇文章 0 订阅

订阅专栏

使用vue的全局函数

// this.$route 当前页签路由，既要关闭的页签路由

this.$store.dispatch('tagsView/delView', this.$route).then(() => {

this.$router.replace({ path:'xxx' }) // 关闭后要去往的页签路由

})

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

Gjfdream

关注关注

1
点赞
踩
2

收藏

觉得还不错? 一键收藏
1
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

若依 vue 基于前后端分离系统实现点击按钮，关闭当前页面及动态导航标签,刷新当前页面

King Saj

12-02

5107

需求: 关闭当前页面,跳转到指定的页面按钮绑定 goBack() 事件 // 返回 goBack(){ // 关闭当前页面 // this.$store.dispatch('tagsView/delView', this.$route); // 跳转目标页面 // this.$router.replace({ path: '/appraise/appraise' }); this.$modal.confirm.

Vue 关闭当前页面会到上次点击的页面

qq_40247817的博客

01-03

2029

提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录前言一、pandas是什么？二、使用步骤1.引入库2.读入数据总结前言提示：这里可以添加本文要记录的大概内容：例如：随着人工智能的不断发展，机器学习这门技术也越来越重要，很多人都开启了学习机器学习，本文就介绍了机器学习的基础内容。提示：以下是本篇文章正文内容，下面案例可供参考一、pandas是什么？示例：pandas 是基于NumPy 的一种工具，该工具是为了解决数据分析任务而创建的。二、使用步骤 1.引入库代码

1 条评论您还未登录，请先登录后发表或查看评论

vue element 关闭当前tab 跳转到上一路由操作

11-20

方法一 this.$store.dispatch(‘delVisitedViews’, this.$route); this.$router.go(-1); 方法二 this.$store.state.tagsView.visitedViews.splice(this.$store.state.tagsView.visitedViews.findIndex(item => item.path === this.$route.path), 1) this.$router.push(this.$store.state.tagsView.visitedViews[this.$store.sta

vue关闭当前标签页

下雨打伞干嘛的博客

07-31

3838

vue关闭当前标签页。

【若依】关闭当前标签页并跳转路由到其他页面

热门推荐

菜鸟学编程

07-29

1万+

由于项目使用tagsView,关闭当前页面需要通过关闭当前标签来实现涉及到几个点： 1. 移除VisitedView 和 CachedView 中的当前项 2. 跳转到最后一次访问的标签主要思路：比对路由路径 ( this.$route.path) 两种方式：一、在vue页面直接实现 closePage() var currentView = this.$store.state.tagsView.visitedViews[0] for (currentV..

Vue 【跳转新页面后】关闭当前标签页并返回指定页面 / 上一步路由

蓝胖子的博客

02-28

4063

Vue 【跳转新页面后】关闭当前标签页并返回指定页面 / 上一步路由

利用vuex关闭当前tab页签

CuiCui_web的博客

08-21

3529

如图：点击删除按钮，关闭当前tab页签在vuex的js文件中写如下方法：（如果没有vuex的js文件，可以自己写一个，参考另外一篇文章，讲解vuex的） /** * @class closeNow * @description 关闭当前界面页签（如在工作项详情界面，点击删除按钮，关闭当前这个页签） * @param {Object} state vuex state * @param {Object} param { tagName: 要关闭的标签名字, vm:.

基于js的iframe 可关闭tab标签组件使用方法

01-12

在我们的组件中，每个tab页将由一个iframe展示，每个iframe加载不同的网页内容。接下来，我们来看`tab`标签。在UI设计中，tab是一种常见的布局方式，用户可以通过点击不同的tab来显示或隐藏相关的内容区域。在...

JavaScript关闭当前页面(窗口)不带任何提示

10-26

特别是关闭当前页面或窗口，这是一个常见的需求。本文将详细解释如何使用JavaScript关闭当前页面或窗口，且不弹出任何提示信息。 1. 不带任何提示关闭窗口的js代码实现不带任何提示关闭当前窗口的功能，可以通过...

angular 关闭当前页_Angular刷新当前页面的几种方法

weixin_39959505的博客

12-21

932

默认，当收到导航到当前URL的请求，Angular路由器会忽略。Heroes重复点击同一链接页面不会刷新。从Angular 5.1起提供onSameUrlNavigation属性，支持重新加载路由。@NgModule({imports: [RouterModule.forRoot(routes, {onSameUrlNavigation: 'reload'})],exports: [RouterM...

vue-element-admin 关闭当前标签页

m0_61072184的博客

05-28

282

vue-element-admin 关闭当前tab标签页

vue element 关闭当前tab 跳转到上一路由

weixin_30652897的博客

06-24

1万+

方法一 this.$store.dispatch('delVisitedViews', this.$route); this.$router.go(-1); 方法二 this.$store.state.tagsView.visitedViews.splice(this.$store.state.tagsView.visitedViews.findIndex(item => ...

若依框架vue3前后端分离版：关闭当前页，返回上一页

m0_56168677的博客

11-16

3648

若依框架vue3前后端分离版：关闭当前页，返回上一页

Vue路由返回上一层并关闭当前标签页

Yangpengxunb的博客

02-22

1929

Vue路由返回上一层并关闭当前标签页

vue-element-admin关闭当前标签页

新技术革命

05-25

5360

// 调用全局挂载的方法 this.$store.dispatch('tagsView/delView', this.$route) // 返回上一步路由 this.$router.go(-1)

Vue项目中的eventBus统一自动关闭页签的处理方法

有话好好说

04-22

621

项目中遇到了业务审查完成后页签不关闭造成用户可能重复进行提交的隐患，如果每位同学都写自己的页签关闭，有可能漏处理或后期不好维护。在此进行统一封装，需要时调用即可。非常简单，某些功能还是前期动动小脑，后期省一大堆事，系统还稳定耐cao：上操作 eventBus共享数据使用场景: 不需要重复的解绑和绑定的场景下使用bus 下面以某种行为自动触发页签关闭功能为例： 1、首先在main.js 中进行注册： Vue.prototype.$Eventbus = new Vue(); //创建e...

若依vue3模板如何跳转页面时关闭当前tag

你喜欢大熊猫嘛

08-12

2346

若依vue3模板如何跳转页面时关闭当前tag

vue 关闭当前页、关闭当前标签tagsview

09-19

在Vue中关闭当前页可以使用`this.$router.go(-1)`方法来实现。`$router`对象是Vue Router提供的全局路由对象，`go`方法用于导航到不同的路由地址。参数-1表示返回上一页，相当于关闭当前页。关闭当前标签tagsview可以通过修改标签数组来实现。假设你使用了Vue的`vuex`状态管理工具，可以在对应的`store`模块中添加一个mutation方法来控制标签数组的变化。具体步骤如下： 1. 在`state`中定义一个tags数组，用于保存打开的标签页信息： ```javascript state: { tags: [] } ``` 2. 在`mutations`中添加一个方法，用于关闭当前标签： ```javascript mutations: { closeTag(state, tag) { // 找到要关闭的标签索引 const index = state.tags.findIndex(t => t.path === tag.path); // 调用数组的splice方法删除对应索引的元素 state.tags.splice(index, 1); } } ``` 3. 在需要关闭标签的地方，比如点击关闭按钮的时候，通过调用`this.$store.commit('closeTag', tag)`来触发关闭标签的mutation方法： ```html <template> <div> <div v-for="tag in tags" :key="tag.path"> <span>{{ tag.title }}</span> <button @click="closeTag(tag)">关闭</button> </div> </div> </template> <script> export default { computed: { tags() { // 从vuex的state中获取标签数组 return this.$store.state.tags; } }, methods: { closeTag(tag) { // 调用mutation方法关闭标签 this.$store.commit('closeTag', tag); } } } </script> ``` 通过上述步骤，可以在Vue中实现关闭当前页和关闭当前标签tagsview的功能。