Javascript 在Gatsby中获取url参数

我最近开始学习React和Gatsby。我的页面有一些URL参数，如何获取并放入

href

attr？一切都在我的本地机器上运行。但是在盖茨比构建完我的变量后，

url=undefined

总是这样

import React from 'react';

const url = typeof window !== `undefined` ? window.location.search : ``;

const Article = ({
  content: {
    text,
    limit,
    rate,
    term,
    link,
    logo: {
      title,
      file: {
        URL,
      },
    },
  },
}) => {

  return (
    <Articles>
      <div>
        <button className="btn">
          <a href={url} target="_blank" rel="noreferrer" id="link-mfo">
            Получить деньги
          </a>
        </button>
      </div>
    </Articles>
  );
};

从“React”导入React；
常量url=窗口类型！==`未定义的`？window.location.search:``；
常量项目=({
内容：{
文本，
极限，
比率，
学期
链接
标志：{
标题
文件：{
网址，
},
},
},
}) => {
返回(
);
};

您需要使用

useState

来存储该数据，并在对

href

属性的每次更改中使其可用。像这样的事情应该可以做到：

import React, { useEffect, useState } from 'react';
    
const Article = ({
  content: {
    text,
    limit,
    rate,
    term,
    link,
    logo: {
      title,
      file: {
        URL,
      },
    },
  },
}) => {
  const [urlParams, setUrlParams] = useState(``);
  useEffect(() => {
    if(typeof window !==`undefined`){
      const queryString = window.location.search;
      const urlParams = new URLSearchParams(queryString);
      if(urlParams){
        setUrlParams(urlParams);
      }
    }
  }, []);

  return (
    <Articles>
      <div>
        <button className="btn">
          <a href={urlParams} target="_blank" rel="noreferrer" id="link-mfo">
            Получить деньги
          </a>
        </button>
      </div>
    </Articles>
  );
};

---

设置为

const

，它正在固定SSR中的值（Sserver-SideRendering），因为这是发生

gatsby build

的地方，它是

未定义的
并且从未更新过。
谢谢！这对我很有用。但现在，若url并没有参数，我会得到null。如何检查var url是否为空？例如，我的链接：，我想从URL中删除此空值，并且仅在var URL不为空时使用。将其包装在一个条件中：
if（urlparms）seturlparms（urlparms）
。如果URL没有参数，它将采用
useState（``）
中设置的初始值（空字符串）。
const url = typeof window !== `undefined` ? window.location.search : ``;