无法读取空属性(读取“目标”)

Question

​

​

当我手动转到localhost:3000/hotels路由时，它会给出以下错误。我知道错误是由于得不到价值而来的，那么如何解决它呢？如果您能通过查看github代码来提供帮助，那就太好了。

Answer 1

路由状态只存在于从一个路由/路径到另一个路由/路径的转换过程中。如果您直接导航到特定的页面，那么状态就是不存在的。为此，我建议应用一些防御性编码技术:对location.state对象使用null检查，并提供一个后备值(如果必要的话)。

示例：

const { state } = useLocation();

const [destination, setDestination] = useState(state?.destination ?? "");
const [dates, setDates] = useState(state?.dates ?? {});
const [options, setOptions] = useState(state?.options ?? []);

请注意，由于我们不知道这些状态代表什么或它们的类型，所以我只是随机地选择了回退，显然您会提供适合您的代码需要的有效回退。