我正在构建一个 Web 应用程序,并使用 Firebase 将用户数据存储在 Cloud Firestore 中。我的网络应用程序上有一个页面,允许用户从 Cloud Firestore 查看他们的文档。我想在我的 URL 末尾添加一个查询参数view.html
所以我可以获取该查询参数值并使用它来搜索文档。
我一直在网上搜索寻找可能的解决方案。到目前为止,我已经看过一些有关该主题的视频,但它们并未深入到我所需要的深度。例如,这个视频 https://www.youtube.com/watch?v=-D5YGTkTBH4显示如何从 URL 添加和获取查询参数,但仅显示如何在控制台中记录这些更改。我如何将其设为我的网址?
我也在 Stackoverflow 上浏览寻找解决方案。这个 Stackoverflow 帖子 https://stackoverflow.com/questions/486896/adding-a-parameter-to-the-url-with-javascript问了一个类似的问题,但是,答案中的许多解决方案都会导致view.html
循环重新加载。为什么会这样,如果这是一个可能的解决方案,我将如何阻止这种情况发生。
我将如何在 Javascript 中附加和获取 URL 查询参数?
你说你想在 javascript 中执行此操作,所以我假设页面本身正在构建/修改指向页面上任一位置或直接通过 javascript 访问的链接。
在浏览器的 javascript 中,有URL https://developer.mozilla.org/docs/Web/API/URL对象,可以构建和分解 URL
let thisPage = new URL(window.location.href);
let thatPage = new URL("https://that.example.com/path/page");
无论如何,一旦有了 URL 对象,您就可以访问它的各个部分来读取和设置值。
添加查询参数使用搜索参数 https://developer.mozilla.org/docs/Web/API/URL/searchParamsURL 的属性,您可以在其中添加参数.append https://developer.mozilla.org/docs/Web/API/URLSearchParams/append方法 - 并且您不必担心管理?
and &
...该方法会为您解决这个问题。
thisPage.searchParams.append('yourKey', 'someValue');
这在此页面上进行了实时演示,添加搜索参数并在每一步显示 URL:
let here = new URL(window.location.href);
console.log(here);
here.searchParams.append('firstKey', 'theValue');
console.log(here);
here.searchParams.append('key2', 'another');
console.log(here);
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)