SoFunction
Updated on 2025-04-05

vue opens other project pages and passes in data for detailed explanation

1. Do not cross-domain, carry sessionstorage to open

Main page, after storing sessions, open the page

let data = {
	text:'I'm data'
};
let isMobile = (/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i)?true:false;

('information',(data));
//IOS cannot open a new window, so it is changed to the mobile terminal to open on the original page, and the PC opens a new window( + "//" +  + reportUrl, isMobile?'_self':'_blank');

Subpage

var date = (('information'));

2. Cross-domain, iframe communication

In the case of cross-domain, sessionstorage cannot be carried and data can be transmitted through the postMessage communication mechanism of iframe;

It can be used without cross-domain, but it is recommended to use the first one, which is more silky~

Main page, write url, and send data after loading

<iframe id='iframe' class="iframe" v-if="src" ref="iframe" :src="src"></iframe>

let data = {
	text:'I'm data'
};
 = url
this.$nextTick(()=>{
	('iframe').onload=()=>{
		('iframe').({
			type:'preview',
			data:data
		},)
		('iframe').onload=null;
 }
})

Subpage, perform monitoring, created or mounted

created() {
	('message',(event)=>{
	 ()
	 if(&&=='preview'){
	  ()
	  let data = 
	 }
	 }, false);
}

Summarize

This is the article about opening other project pages and passing data in vue. This is the end of this. For more related vue to opening project pages and passing data content, please search for my previous articles or continue browsing the related articles below. I hope everyone will support me in the future!