该视频仅会员有权观看
立即开通课程「React.js 前端应用开发实践」权限。
- 创建一个新文件在
src/post
目录下,文件名为 post
。
- 定义与内容相关的路由在
post
文件中。
- 设置一个名为
post rot
的路由,包含一个 rex
元素,使用 react fragment
。
- 定义路由
path
为 post
,element
属性值为 post index x
。
- 在
app arter
添加一个来自 post
目录的 post rot
嵌套路由。
- 设置
app header
组件中的 nave
元素,添加导航链接指向 /post
,链接文字为 "内容"。
- 编辑
app.css
文件,为导航添加样式,使用 nap
选择器设置为 flex
布局并设置间隔为 24 像素。
- 为
nav
下的 <a>
元素设置 display:block
。
- 重新定义
post index
组件为函数组件,使用 useEffect
设置文档标题为 "内容零号网"。
- 在组件视图中加入标题元素
h1
,标题文字为 "内容"。
- 测试在浏览器中访问
/post
,应显示 post index
组件的内容。