首页 > 其他 > 详细

如何实现页面传参

时间:2021-08-13 17:37:07      阅读:37      评论:0      收藏:0      [点我收藏+]

1.在两个页面传参使用路由传参

在第一个页面使用下面红色的部分进行路由传参(记的在配置路由的地方写上name属性)传递的参数是 this.imgurl

// 电子录取通知书
            async toNotice() {
                const {
                    data: res
                } = await this.$http.get(‘/examinee/admission/public/createAdmissionLetter‘, {
                    params: this.formInline
                })
                if(res.code === 200 ){
                    // this.$router.push(‘/notices‘)
                    
                    this.imgurl = res.msg
                    console.log(this.imgurl)
                    this.$router.push({
                        name:‘notices‘,
                        query:this.imgurl
                        })
                }else{
                    // this.black = true
                    this.$message.error((‘查询失败,请输入考生号和姓名‘))
                }
            },

 在接收参数的页面使用

this.$route.query进行接收就可以拿到传递过来的imgurl参数
mounted() {
            // 把接收过来的参数赋值给imgurl
            this.imgurl = this.$route.query
            console.log(this.$route.query)
        },
                

2. 在HTML单页面实现传递参数

使用window.open可以实现页面的跳转和传递参数(传递的参数在路径里面)

技术分享图片

 

 

async toNotice() {
                    const {
                        data: res
                    } = await axios.get(‘http://192.168.0.40:8011/examinee/admission/public/createAdmissionLetter‘, {
                        params: this.formInline
                    })
                    if(res.code === 200 ){
                        // this.$router.push(‘/notices‘)
                        
                        this.imgurl = res.msg
                        console.log(this.imgurl)
                        window.open("notice.html?imgurl="+this.imgurl,‘_blank‘)
                    }else{
                        this.$message.error((‘查询失败,请输入考生号和姓名‘))
                    }
                },

在接收的页面就需要在路径里面截取到我们需要的参数(?后面的是传递过来的参数)

imgurl 就是传递过来的参数   

GetRequest  是截取到我们需要的参数
return {
    imgurl: this.GetRequest().imgurl
    }

GetRequest() {
var url = location.search; var theRequest = new Object(); if (url.indexOf("?") != -1) { var str = url.substr(1); strs = str.split("&"); for(var i = 0; i < strs.length; i ++) { theRequest[strs[i].split("=")[0]]=unescape(strs[i].split("=")[1]); } } return theRequest; },

 

如何实现页面传参

原文:https://www.cnblogs.com/syhbk1225/p/15137560.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!