首页 > 其他分享 >vue js公共截取URL的key: value方法

vue js公共截取URL的key: value方法

时间:2024-07-12 10:42:28浏览次数:10  
标签:vue hash URL userId value window let location

let URL = http://localhost:8080/#/ficu/?taskid=1001-2271023&pageId=146&ssid=74529457205982&channelld=IPCC&userId=xx

// 取值URL
let href = window.location.href   // 拿到完整的URL
let hash = window.location.hash   // 取#后面的所有URL

// 取值方法
getUrlParams () {
  let hash = window.location.hash  
  console.log('-------hash---', hash)
  // 输出#/ficu/?taskid=1001-2271023&pageId=146&ssid=74529457205982&channelld=IPCC&userId=xx
  let obj = {}
  let urlStr = hash.split('?')[1]   // 取问号后面的值
  let params = urlStr.split('&')
  for (let i=0, len=params.length; i<len; i++) {
    let arr = params[i].split('=')
    obj[arr[0]] = arr[1]
  }
  return obj
}


// 用法
let objList = this.getUrlParams()
objList.pageId = '146'

console.log('-----objList----', objList)
// 输出对象-----objList---- 
 {
    taskid: '1001-2271023'
    pageId: '146'
    ssid: '74529457205982'
    channelld: 'IPCC'
    userId: 'xx'
 }
 

 

标签:vue,hash,URL,userId,value,window,let,location
From: https://www.cnblogs.com/guwufeiyang/p/18297810

相关文章

  • Java毕业设计基于Vue+SpringBoot的电影院订票选座管理系统(代码+数据库+文档LW+运行成
    很多朋友发现后期找不到文章,收藏关注不迷路文章目录项目介绍技术介绍项目界面关键代码目录项目介绍在飞速发展的今天,网络已成为人们重要的交流平台。电影院每天都有大量的需要通过网络发布,为此,本人开发了一个基于B/S;浏览器/服务器;模式的电影院管理系统。该系......
  • Java毕业设计基于Vue+SpringBoot的畅游游戏销售平台(代码+数据库+文档LW+运行成功)
    很多朋友发现后期找不到文章,收藏关注不迷路文章目录项目介绍技术介绍项目界面关键代码目录项目介绍近些年来,随着科技的飞速发展,互联网的普及逐渐延伸到各行各业中,给人们生活带来了十分的便利,畅游游戏销售平台利用计算机网络实现信息化管理,使整个畅游游戏销售平......
  • Java毕业设计基于Vue+SpringBoot的爱看漫画小程序(代码+数据库+文档LW+运行成功)
    很多朋友发现后期找不到文章,收藏关注不迷路文章目录项目介绍技术介绍项目界面关键代码目录项目介绍相比于以前的传统手工管理方式,智能化的管理方式可以大幅降低爱看漫画的运营人员成本,实现了爱看漫画的标准化、制度化、程序化的管理,有效地防止了爱看漫画的随意管......
  • vue 混合方法mixins 协可以写入公共的方法
    新建一个文件夹mixins 同views同级exportdefault{data(){return{};},mounted(){},methods:{//修改标题方法ready(callback){//如果jsbridge已经注入则直接调用if(window.AlipayJSBridge){callback......
  • 基于java+springboot+vue实现的在线教育系统(文末源码+Lw)111
    基于SpringBoot+Vue的实现的在线教育系统(源码+数据库+万字Lun文+流程图+ER图+结构图+演示视频+软件包)系统功能:本在线教育系统管理员功能有个人中心,用户管理,讲师管理,普通管理员管理,课程管理员管理,课程管理,课程分类管理,教师管理,名师管理,系统管理,订单管理。普通管理员和课程......
  • 基于java+springboot+vue实现的作业管理系统(文末源码+Lw)110
    基于SpringBoot+Vue的实现的作业管理系统(源码+数据库+万字Lun文+流程图+ER图+结构图+演示视频+软件包)功能描述:作业管理系统有管理员,教师,学生三个角色。教师和学生都可以进行注册然后再登录。学生可以修改自己的密码,查看和下载作业信息,并且可以提交自己写好的作业,并且可以......
  • VUE购物车案例
    目标效果1、创建vm对象绑定class=app的标签,创建goodlist和buyGoods变量2、html页面编写for循环指令,将goodlist中的数据取出来3、全选和全不选,计算总价https://blog.csdn.net/kouryoushine/article/details/87984749https://blog.csdn.net/mutouren121/article/detail......
  • Nginx部署vue项目到本地windows
    部署1.将build生成的dist目录复制到nginx下的html目录中。 2.修改ningx里的ningx.conf文件,(解决404的那段代码可以不加)3.重启nginx,浏览器访问“ http://localhost:8080/ ”,即可。4.第二种:因为nginx可能会部署多个项目,针对不同项目增加配置是一种很正常的操作。(需要新增一......
  • 如何用Vue3和Plotly.js创建交互式表格?
    本文由ScriptEcho平台提供技术支持项目地址:传送门Plotly.js动态生成HTML表格应用场景介绍在数据分析和可视化领域,经常需要以表格的形式展示数据。Plotly.js是一款功能强大的JavaScript库,不仅可以创建交互式图表,还可以动态生成HTML表格。代码基本功能介绍本代......
  • 如何用Vue3和Plotly.js绘制交互式瀑布图
    本文由ScriptEcho平台提供技术支持项目地址:传送门使用Plotly.js在Vue中创建瀑布图应用场景瀑布图广泛用于可视化财务报表和展示增量变化,例如利润表、现金流量表和收入分析。它们通过将正值和负值堆叠在垂直轴上,清晰地展示每个阶段的贡献和变化。基本功能本代码演......