logo

该视频仅会员有权观看

立即开通课程「Next.js 前端应用开发实践」权限。

¥
199
/ 年

在 Next.js 应用里定制错误页面(Error)

  • 制造一个错误停止服务端的MySQL服务后,访问内容列表页面post时会出现一个错误页面。
  • 此错误页面指出组件"post list"有问题,提示"props data map不是函数",表明服务端接口有问题,返回了500状态码的错误。
  • 为处理错误,在应用的app目录下创建error文件并定义一个名为error的客户端组件。
  • 使用"use client"指令将组件标记为客户端组件,并设置视图及样式,提示"堂前出了点小问题;我们会尽快解决"。
  • 自定义的错误被放在post目录下,显示找不到组件的错误信息。
  • 创建了一个名为air.css的样式表,调整样式后,页面中间显示了自定义的错误信息。
  • 在error组件中添加了一个error属性,提取并展示了错误信息"props data map is not a function"。