我有这个代码:
<a
onClick={() => {
if (fortype === "user") {
if (rd.track !== null) {
router.push({
pathname: `/tracks/${rd.track._id}`,
query: {
from: router.asPath,
at: page,
},
});
}
} else {
if (rd.owner !== null) {
router.push({
pathname: `/users/${rd.owner._id}`,
query: {
from: router.asPath,
at: page,
},
});
}
}
}}
>
My link
</a>
我试图用next/link替换<a>
标签,但它给了我这个错误:
错误:失败的 prop 类型:prop href
需要<Link>
中的string
或object
,但得到的却是function
。打开浏览器的控制台以查看组件堆栈跟踪。
我试着这样做:
import Link from "next/link";
<Link
href={() => {
if (fortype === "user") {
if (rd.track !== null) {
return {
pathname: `/tracks/${rd.track._id}`,
query: {
from: router.asPath,
at: page,
},
};
}
} else {
if (rd.owner !== null) {
return {
pathname: `/users/${rd.owner._id}`,
query: {
from: router.asPath,
at: page,
},
};
}
}
}}
>
My link
</Link>
1条答案
按热度按时间6fe3ivhb1#
您的逻辑是正确的,但
<Link>
组件不接受函数,但是,如果你声明一个函数,然后把它的结果传递给
href
,它就可以工作了:这是可行的,因为这里你传递的是一个函数的结果,它是一个对象,而不是一个函数。