时间戳

首页 > 解决方案 > 如何使用 window.location.hash 和 reactjs 获取 url 值？

javascript - 如何使用 window.location.hash 和 reactjs 获取 url 值？

问题描述

我有这个 url http://localhost:3000/#/consultation/?idc=xxxd?iduser=Hyfzjg2并且我想获取 idc 和 iduser 的值，以便在我的带有 ReactJs 的 API 上使用它。

我试试这个：

let isInitialized = false;
const initialValues = {};
const initValues = () => {
    if (isInitialized === false) {
        const searchParams = new URLSearchParams(window.location.hash);
        const values = [
            { urlKey: "idc", stateKey: "idC" },
            { urlKey: "iduser", stateKey: "idUser" },
        ];
        values.forEach(item => {
            const urlValue = searchParams.get(item.urlKey)
            if (urlValue) {
                initialValues[item.stateKey] = urlValue;
            }
        });
        isInitialized = true;
    }
    return initialValues;
};

console.log(initValues())

当我运行它时，我得到{}一个空值。

如何获得idcand的值iduser？

标签： javascriptreactjsurlsearchwindow.location

解决方案

我认为您的路径构造不正确：

如果您有路径http://localhost:3000/consultation并且想要添加查询字符串，那将是http://localhost:3000/consultation?idc=xxxx并且 window.location.search将会是?idc=xxxx那时。

# 是页面上某个元素的选择器，例如#section=4，因此您通常会滚动到该部分。这看起来像这样：

http://localhost:3000/consultation#section=4 并且window.location.hash将是“#section = 4”

推荐阅读