reactjs - 在 next.js 中获取 url 查询参数时遇到问题
问题描述
我只是想在我的 url 中获取参数的值。
我是 next.js 的新手,但总的来说反应还很新。
我的网址看起来像:
localhost:3000/?code=VhXHWwRemC32dPmm3oj0mMravO6MP3
现在,我只是在渲染一个页面,例如:
const Index = () => {
const router = useRouter();
const code = router.query.code;
console.log(code);
return(
<div>
<p>code: {code}</p>
<a href={Oauth.discord_login_url}login</a>
</div>)
};
这样我就可以查看是否从 url 中正确获取了代码。
一旦我以不和谐的方式登录,我就会返回 Index,然后 url 看起来就像我在上面显示的那样。我正在尝试获取代码的价值,以便我可以使用它。让我困惑的是
<p>code: {code}</p>
成功在页面上显示“code”的值。但
console.log(code)
显示未定义。为什么不一样?
解决方案
尝试添加getInitialProps
:
const Index = () => {
const router = useRouter();
const code = router.query.code;
console.log(code);
Index.getInitialProps = async () => {
return {};
};
return (
<div>
<p>code: {code}</p>
<a href={Oauth.discord_login_url}>login</a>
</div>
)
};
推荐阅读
- java - 映射 UML 图到 Java 代码转换
- javascript - 字符串匹配函数返回一个数组,但如果转换为数字,则返回匹配的数字
- c++ - 我遇到了 C++“参数太多”警告的问题
- python - SQLAlchemy 有最大数量的关系?
- c++ - CPP 中的 ++ 运算符是否对 char 有任何重载?
- python - 为列表列表中的每个列表映射一个函数
- python - 如何让 Pandas 从下一行开始在新列中创建 sumsum?
- mfc - MFC CImageList DeleteImageList() vs Remove()
- android - Android studio 线性布局问题:我应该如何在没有嵌套权重的情况下布局我的?
- python - 16位PNG的像素值20930不应该是灰色阴影吗?