vue将后端数据添加到页面实例,vue怎么把数据传到后端

　　本文主要介绍vue打开其他项目页面和输入数据的相关信息。通过示例代码详细介绍，对您的学习或工作有一定的参考价值。下面让我们跟随边肖一起学习。

　　1.不跨域，携带sessionstorage打开

　　主页，存储sessionstorage后，打开页面。

　　let data={

　　正文：“我是数据”

　　};

　　let is Mobile=navigator . user agent . match(/(Phone pad pod iPhone iPod IOs iPad Android Mobile BlackBerry IEMobile MQQBrowser JUC Fennec wOSBrowser browser ng WebOS Symbian Windows Phone)/I)？真：假；

　　session storage . setitem( information ，JSON . string ify(data))；

　　//ios无法打开新窗口，所以改为移动端在原页面打开，pc端打开新窗口。

　　window . open(window . location . protocol // window . location . host report URL，isMobile？_ self : _ blank )；

　　子页面

　　var date=JSON . parse(session storage . getitem( information )；

　　2.跨域，iframe通信

　　跨域的情况下，无法携带sessionstorage，可以通过iframe的postMessage通信机制传输数据；

　　可以不用跨域，但是更推荐用第一种，丝滑~

　　主页面，写url，加载后发送数据。

　　iframe id= iframe class= iframe v-if= src ref= iframe :src= src /iframe

　　let data={

　　正文：“我是数据”

　　};

　　this.src=url

　　这个。$nextTick(()={

　　document . getelementbyid( iframe )。onload=()={

　　document . getelementbyid( iframe ). content window . postmessage({

　　类型：“预览”，

　　数据：数据

　　}，this.src)

　　document . getelementbyid( iframe )。onload=null

　　}

　　})

　　子页面，执行监控，已创建或已装载。

　　已创建(){

　　window . addevent listener( message ，(event)={

　　console.log(event.data.type)

　　if(event . data event . data . type== preview ){

　　console.log(event.data.data)

　　让数据=事件.数据.数据

　　}

　　}，假)；

　　}

　　总结

　　这就是这篇关于vue打开其他项目页面并传输数据的文章。有关vue打开项目页面和传输数据的更多信息，请搜索我们以前的文章或继续浏览下面的相关文章。希望大家以后能多多支持我们！

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。