• 【Vue】url拼接参数获取解析


    前言:
    前端在开发的时候有很多情况下需要提供不带参数的链接或者带参数的链接给自己使用或者给第三方系统,如果提供给第三方系统使用的话一般是第三方需要通过iframe/window.open/a标签打开链接进入对应的页面。
    情况一:获取当前浏览器地址栏链接
    1.location.href:获取当前浏览器地址栏中的链接
    在这里插入图片描述
    2.new URL(location.href):解析当前浏览器地址栏中的链接。search中有值才能从searchParams中获取值。
    在这里插入图片描述
    3.new URL(location.href).searchParams.get(‘articleId’):获取浏览器地址栏中地址后面拼接的参数
    在这里插入图片描述
    情况二:解析指定url
    例如**:**
    http://localhost:8080/index?param=123
    1.new URL(‘http://localhost:8080/index?param=123’):解析指定链接
    在这里插入图片描述
    2.new URL(‘http://localhost:8080/index?param=123’).searchParams.get(‘param’):获取指定链接中的参数
    在这里插入图片描述

    对url的整体分析:
    1.不带#的url
    http://localhost:8080/index?param=123’
    可以直接获取链接中的参数
    2.带#的url
    http://localhost:8080/#/index?param=123’
    不可以获取到链接中的参数。
    原因一:此时的#在链接中会被认为是标签中的标识,即锚点也就是重定向,因为进行了重定向所以访问不到
    原因二:加了#号的链接是不会被发送到服务器的,浏览器也不会解析链接携带的参数
    解决办法:把参数放到前面。http://localhost:8080?param=123#/index

    在这里插入图片描述

  • 相关阅读:
    ubuntu 22.04 安装python-pcl
    4.cuBLAS开发指南中文版--CUDA 数据类型引用
    网上智慧教育云vr实验室管理系统促进教学公平和普及
    排序算法(Java实现)
    数据结构与算法编程题10
    在国外当程序员有多高兴
    今日睡眠质量记录81分
    陕西灵活用工平台开发有风险吗?
    【Redis】5.消息队列
    Android 设置默认应用
  • 原文地址:https://blog.csdn.net/weixin_42342065/article/details/127868983