今天在 $nextTick的回撥中，用了window.open，發現不能開啟新視窗了。搞了一上午才發現是被chrome攔截了（怪我眼拙沒看見…）。

後來搜了一下chrome的攔截機制，發現是因為chrome阻止了非使用者觸發的window.open。

先貼上程式碼：

<el-menu-item :index="item[1].src" :class="{openWindow: item[1].src === hasOpenWindow}" @click="open(item[1].src)" :data-open="item[1].openItem" >xxx</el-menu-item
 
>

open (url) {
	// 在更新完DOM後再執行
	this.$nextTick(() => {
		let openWindow = document.querySelector('.openWindow');
		// 如果data-open屬性是true則可以開啟新頁面，且不會重新整理iframe或開啟router-view
		if (openWindow.dataset.open) {	// 改為原生js獲取自定義屬性
			let width = 550;
			let height = 373;
			let top = (window.screen.availHeight -
 
 height) / 2;
			let left = (window.screen.availWidth - width) / 2;
			window.open(url, 'newwindow', 'height=' + height + ',width = ' + width + ',top = ' + top + ',left = ' + left + 'toolbar = no,menubar=no,scrollbars=no,location=no,status=no');
		}
		if (!openWindow.dataset.open) {	// open === false  再顯示iframe
 

			this.changeView(false);		// 不顯示router-view
			// 子元件向父元件傳
			this.$emit('getIframeSrc', url);
		}
	});
}

可以看到，因為window.open被寫在了$nextTick的回撥裡面，即使我們觸發了open事件，此時是在回撥的上下文中，並不在被點選的open事件裡面了，也就不算是使用者點選觸發的了。自然chrome就給遮蔽掉了。