[vue-router, use router.resolve to open a new page routing jump]

vue-router, open a new page routing jump

method

pass parameters

let {
    
     href } = this.$router.resolve({
    
    
	path: '/path',
	query:{
    
    
	    id: id ,
	    year: year
	}
})
window.open(href, '_blank');

Get parameters

mounted(){
    
    
	this.data = this.$route.query.id
	console.log(this.data)
},

router.resolve

router.resolve方法返回路由地址的标准化版本。

resolve receives two parameters: rawLocation, currentLocation (optional).

  • Among them, rawLocation is the route to be converted, and rawLocation can be an object or a string.
  • If currentLocation is not passed, the default is currentRoute.

参考:

https://blog.csdn.net/qq_33635385/article/details/125175571?spm=1001.2014.3001.5502

The three parameters of window.open()

window.open("要跳转的网址", "跳转形式或者名字", "给出窗口添加新的的属性(字符串形式)");

example:

window.open("###", "_blank","height=600, width=600, top=50, left=50, toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no");

The first parameter is the address:url

The second parameter is打开方式或者窗口命名

  1. Open Baidu in the current window, and make the URL address appear in the search bar.
    window.open(“http://www.baidu.com/”, “_search”);
    window.open(“http://www.baidu .com/", "_self");
  2. Open Baidu in a new window
    window.open("http://www.baidu.com/", "_blank");
  3. Open a new window and name it "hello"
    window.open("", "hello");

In addition, there are several options for the second parameter of the open function:

_top : 如果页面上有framesets,则url会取代framesets的最顶层, 即, 如果没有framesets, 则效果等同于_self.
_parent: url所指向的页面加载到当前frame的父亲, 如果没有则效果等同于_self.
_media : url所指向的页面加载到Media Bar所包含的HTML代码区域中.如果没有Media Bar则加到本身.

The third parameter (optional): add other things on the new window

channelmode : yes|no|1|0 (窗口显示为剧场模式[全屏幕显示当前网页, 包括工具栏等],或频道模式[一般显示]).
directories : yes|no|1|0 (是否添加目录按钮, 比如在IE下可能会有一个"链接"这样的按钮在最上面出现)
fullscreen : yes|no|1|0 (使浏览器处理全屏幕模式, 并隐藏标题栏和菜单等)
menubar : yes|no|1|0 (是否显示浏览器默认的菜单栏)
resizeable : yes|no|1|0 (窗口是否可调整大小)
scrollbars : yes|no|1|0 (是否允许水平或垂直滑动条)
titlebar : yes|no|1|0 (是否添加一个标题栏)
toolbar : yes|no|1|0 (是否添加浏览器默认的工具栏)
status : yes|no|1|0 (是否显示状态栏)
location : yes|no|1|0 (是否显示搜索栏)
copyhistory : yes|no|1|0 (似乎已经废弃, 如果只要工具栏显示, 历史按钮就会显示出来)
height : 窗口的高度, 最小值为100像素
width : 窗口的宽度, 最小值为100像素
left : 窗口的最左边相对于屏幕的距离

Guess you like

Origin blog.csdn.net/weixin_52755319/article/details/128092708