学习了React很久,一直没有机会总结下,最近打算写一个简单的React,希望让初学者一看就懂,不走弯路,我尽量写的简明点
好了开始吧!
首页我们要利用npm安装 react(当然你也可以用引用方式)跟着下面步骤: npm install -g create-react-app
create-react-app my-app

cd my-app
npm start //这条命令就是启动react这个项目 如果你打开my-app目录跟我上面的一样,那么我们继续
打开App.js,把多余的代码删除了,像我这样就好,react是jxs语法来写

下面开始写组件,我们在div里面:

 import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css'; class App extends Component {
render() {
return (
<div className="App">
组件一
</div>
);
}
} export default App; //现在App就是一个组件,export default会把App暴露出去,让其他组件引入

我们打开index.js文件,你会看到 import App from './App'   (这句话的意思是,引入App.js这个组件)

ReactDom.render(<App/>,document.getElementById("root"))  这句话会把 App这个组件挂载到index.html文件的id为root的div里面

import在es6里面可以引入export default 暴露出来的组件


React教程-初入的更多相关文章

  1. 【Xbox one S】开箱&开机&初入坑心得

    再来一发水贴,先上产品标准照镇贴: 前言 身为一个资深单机游戏玩家,常年混迹在PC平台,但内心深处一直对主机有种迷之向往,感觉那才是单机游戏的正处之地,坐沙发上拿着手柄对着电视跌宕起伏才是正确的游戏姿 ...

  2. Git初入

    Git记录 使用git 也有一段时间了, git的入门级了解也就不再多说, 但平常使用中, 仍然会遇到很多问题, 在此记录一二. 在查资料的过程中, 发现了两个比较好的资料: 特别是第二个, 相当详细 ...

  3. 初入TensorFlow————配置TensorFlow

    能看到这说明你对python已经有一定的了解了,因此很多基础直接跳过. 一.TensorFlow环境配置: TensorFlow的环境配置在网上很多的教程都是用anaconda的方式,但是很容易出现冲 ...

  4. 初入 Ubuntu 的一些操作 · Lei's blog

    查看系统版本 cat /etc/os-release 修改 root 密码 passwd 新建用户 新建用户: adduser username 将新用户加入 sudo 组,这样就可以用 sudo 命 ...

  5. Scala初入

    何为Scala物 Scala为基于JVM虚拟机中的面向对象与函数式编程思想并且完全兼容Java的混合编程语言,可以是Scala与Java是同根同源的,既然Scala与JAVA都是基于JVM之上的编程语 ...

  6. 初学HTML5、初入前端

    学习HTML5是一个漫长的过程,当中会遇到很多技术与心态上的变化.刚开始学习,我们不能发力过猛,需要一个相对稳定的状态去面对.多关注一些自己感兴趣的网站和技术知识,建立自己的信心与好奇心,为以后的学习 ...

  7. 0x00linux32位汇编初入--前期准备

    0x00汇编初入--前期准备 一.汇编工具 在linux平台下常用的编译器为as,连接器为ld,使用的文本编辑器为vim,汇编语法为att 以下是一些工具: addr2line 把地址转换为文件名和行 ...

  8. 初入职场的建议--摘自GameRes

    又开始一年一度的校招了,最近跑了几个学校演讲,发现很多话用短短的一堂职业规划课讲还远远不够,因为那堂课仅仅可能帮大家多思考怎样找到一份合适的工作,并没有提醒大家怎样在工作中发展自己的职业. 见过这么多 ...

  9. SuperMap iClient for JavaScript初入

    SuperMap iClient for JavaScript初入 介绍SuperMap for Js的简单使用. 推荐先看下这篇文档:SuperMap iClient for JavaScript ...

随机推荐

  1. String & dp Problem Round 3 2017.4.22

    对每一个特征求前缀和,如果它减去前面的某一个地方的和,得到的每个特征是相等的,那么然后就可以更新答案. 需要解决这个两个问题 1.如何使答案尽量大? 这个很简单,直接找尽量靠前的地方就好了. 2,如何 ...

  2. dp练习 2016.2.24

    很经典的一道状压dp(似乎叫做旅行商问题),用f[i][s]表示在到达点i,已经经过的城市用二进制表示为s,于是方程就很简单了: f[i][s] = min { f[j][s ^ (1 << ...

  3. uva 1658 Admiral - 费用流

    vjudge传送门[here] 题目大意:给一个有(3≤v≤1000)个点e(3≤e≤10000)条边的有向加权图,求1~v的两条不相交(除了起点和终点外没有公共点)的路径,使权值和最小. 正解是吧2 ...

  4. 常用maven命令总结

    常用Maven命令: mvn -v //查看版本 mvn archetype:create //创建 Maven 项目 mvn compile //编译源代码 mvn test-compile //编 ...

  5. 小Z的袜子(莫队分块)题解

    小Z的袜子(hose) 作为一个生活散漫的人,小Z每天早上都要耗费很久从一堆五颜六色的袜子中找出一双来穿.终于有一天,小Z再也无法忍受这恼人的找袜子过程,于是他决定听天由命……具体来说,小Z把这N只袜 ...

  6. 51nod 1021 石子归并

    区间dp 递推比递归的常数要小  所以还是尽量学会递推吧 看题解  各种恶心啊  有木有 还是视频讲的直接呃   不过就是讲的有点儿慢 链接:https://www.bilibili.com/vide ...

  7. 【TCP/IP详解 卷一:协议】第十章 动态选路协议

    更为详细的RIP博客解析: RIP理论 距离向量算法的简介: RIP协议V-D算法的介绍 10.1 引言 静态选路修改路由表的三种方法 (1)主机设置时,默认的路由表项 (2)ICMP重定向报文(默认 ...

  8. Cocos2d-x学习笔记(十二)3D特效

    特效类即是GridAction类,其实就是基于网格的3D动作类.需开启OpenGL的深度缓冲,否则容易3D失真. 下边是一个snippet,创建网格对象,并将其添加到当前layer:同时,将进行3D特 ...

  9. 会员通过消费攒积分,升级RENEW以及降级的需求

    需求看上去及其简单,如下: 用文字描述就开始不容易了. 先按等级排个序,根据下一个等级,推前一个等级: --C---B----V-----A 在计算一下升级需要的积分:--C表示普通会员-----需要 ...

  10. java 基本数据类型及自动类型提升

    1.Java的8种基本数据类型及其所占空间大小: boolean  8bit/1byte       byte      8bit/1byte       char      16bit/2byte ...