准备 React 组件

0
视频
0
完成
0%
进度
0
分钟
0
完成
0%
进度

打开 main.js ,下面我们直接在这个文件里面定义几个组件,然后再添加几个路由使用这些组件。

在文件的一开始,我已经导入了一些东西,semantic ui ,react,react dom ,react router 。Router,Route,还有 Link 这几个东西都是来自这个 react router 。

先添加一个叫 App 的 react 组件 .. 用一个 class ,名字是 App ,继承 react component ,添加一个 render 方法,return 一些东西。一组 div,里面又是一组 div ,上面加上点 css 类,这些类的样式来自 semanitc ui 。

在它的里面, 一会儿我们可以放两个链接,暂时先留为空白的 … 在这组 div 里面,再添加一个 this.props.children ,显示它的儿子。

下面再去定义一个 react 组件 .. 名字可以是 TV ,继承 react component ,添加 render 方法,return 一些东西,一组 div ,里面先加上点文字 ,然后再用一个 this.props.children ,显示它的儿子 .. 这个组件可以作为电视节目列表的页面 ..

然后再添加一个可以显示具体电视节目的组件 .. 再去定义一个 class,名字是 Show ,继承 react component ,用一个 render 方法,返回要显示的东西,一组 div ,里面添加点文字 .. 节目 ..

保存 .. 这里出现了一个错误 .. 在第 14 行这里 .. 这是因为 React 组件里要显示的东西要有一个统一的包装 .. 在它们周围添加一组 div ... 保存 ...

这样我们就准备好了几个 react 组件,下面再去添加几个路由。

准备 React 组件《 React 路由 》

统计

14696
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点