zoukankan      html  css  js  c++  java
  • react组件在项目中的应用(基础知识)


    上图我是定义了5个模块,全部都渲染在一个组件里面。可以先看看我的代码结构

    我将Hello文件夹下的index.jsx文件作为父组件,最后渲染在根组件中。

    那我们怎么输出这个Hello组件呢?要达到上图的效果。
    我们知道要有头部,要有中间的按钮,要有轮播模块,要有列表模块,还要有推荐模块。他们之间是互不影响的。
    那我们怎么在Hello组件中体现这个组件的独立性呢?像header组件可以作为公共头部,供所有页面引用,我们
    将其放在components中,像这种纯展示数据的组件我们可以叫其木偶组件。
    这是header组件的文件

    看我最上面的页面其实可了解到,像轮播列表这些其实是与数据的渲染相关的,也就是可以与后端交互
    请求数据的模块,也就是我们放在
    中的组件,它可以定义数据定义规则,最后展示在Hello组件中,像这样的就是智能组件。我们可以看下图

    Hello组件通过引用这些组件最后在根元素上渲染出模块。
    这只是基础的组件知识,接下来我们逐渐深入。请耐心等待我的系列博客。
    本博客升华自:大众点评app视频。

    完整的demo见github:https://github.com/JserJser/reactWebApp/tree/master/test

  • 相关阅读:
    Debian 添加用户
    如何让安卓手机访问内网服务器?
    数据库权限
    CentOs
    批量导入sql文件。
    使用Navicat Premium连接mysql数据库
    git 合包
    linux 下文件打包
    git 分支管理
    gcc8.2安装
  • 原文地址:https://www.cnblogs.com/smart-girl/p/9682551.html
Copyright © 2011-2022 走看看