基于vue中获取当前url携带的参数

前言:

今天在开发项目的过程中,需要用的调用企业微信的接口,获取用户的相关信息,后端给的url里面携带了几个参数,需要前端获取一下,然后再把这些参数传入到get的api请求中。
加QQ技术交流群741843152,一起讨论哦~~~~
欢迎访问我个人博客,里面有更多干货哟~~:点击即可访问
关注博主微信公众号,获取更多关于前端的干货哦

获取?后面的参数
  http://192.168.1.105:8080/#/idInput?username=%22%E5%BC%A0%E4%B8%89%22

 获取参数方法     let id = this.$route.query.username
获取不带?的URL中的参数
  http://192.168.1.12:8080/#/home/newsinfo/234

在路由中配置路由

{ path: '/home/newsinfo/:id', component: Newsinfo }

 .vue页面设置

<template>

      <router-link :to="'/home/newsinfo/' + item.id">

</template>

 获取参数方法    let id = this.$route.params.id

注:转载于leahtao作者,点击即可访问

直接干代码

1.先在data中定义好全局变量


```javascript
data() {
	retrue {
	staffNo:'',
	tenantId:'',
	}
}

2.在vue的created中写上

    created() {
      // 界面构建时开始获取url里携带的参数
      let staffNo = this.$route.query.staffNo
      let tenantId = this.$route.query.tenantId
      this.staffNo = staffNo
      this.tenantId = tenantId
      console.log(staffNo)
      console.log(tenantId)
      this.getBillDetails()
      // 这个一定是放在获取参数之后的
      this.getBillDetails()

    },

3.就是发起具体的网络请求了

getBillDetails() {     		
   getBillDetail(this.staffNo,this.tenantId).then(res => {
      const data = res.data.data
      this.obj = data
      console.log(data)
      // 判断服务器端返回的数据是要显示男或者女,返回true和false
      this.obj.sex === '男' ? this.showImage = true : this.showImage = false
        })
      }
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值