react  使用方法:

第一步: 初始化react 项目

(1)安装node npm

(2)npm install --global create-react-app

(3)create-react-app my-app

(4)cd ./my-app

npm   start     (运行)

第二步: react 核心思想:

组件化开发,目的是重复使用,小组件组成大应用

在creat-react-app之后生成的文件夹src中是我们需要修改的源码,

入口是index.js  然而它只渲染了App这个组件,换而言之 修改App.js 就可以修改页面内容,

index.js就是个中转站,当然我们也可以渲染新组件,方法就是新建New.js 然后修改index.js

注意:

1 新建一个New.js

1组件首字母大写

2由于要使用jsx,所以必须引入react from react

3. react 里面的注释方法是:      {/* 注释内容*/}

4,用 react 命名的时候注意 :你所命名的名字里面不能有  (大写的字母)

升级reeact 版本的的指令是:

cnpm install --save react@16.8.6 react-dom@16.8.6

(目前是最新版本)

react 使用的方法:的更多相关文章

  1. [react 基础篇]——React.createClass()方法同时创建多个组件类

    react 组件 React 允许将代码封装成组件(component),然后像插入普通 HTML 标签一样,在网页中插入这个组件.React.createClass 方法就用于生成一个组件类 一个组 ...

  2. react生命周期方法有哪些?

    react生命周期方法有哪些? React 16.3+ getDerivedStateFromProps:在调用render()之前调用,并在每次渲染时调用.需要使用派生状态的情况是很罕见的 comp ...

  3. JsPlumb在react的使用方法及介绍

    JsPlumb在react的使用方法及介绍 一.相关资料来源: 1.https://bitqiang.gitbooks.io/jsplumb/content/Chapter1_IMPORTS_AND_ ...

  4. react的每个方法为什么一定要bind this

    一开始学习react的时候就了解了react的每个方法都要bind(this)或者使用箭头函数绑定this的指向,到底是为什么要这么写呢,当时要学习的东西太多了就没在意,今天特别好奇(不搞懂不吃饭的态 ...

  5. 理解React中es6方法创建组件的this

    首发于:https://mingjiezhang.github.io/(转载请说明此出处). 在JavaScript中,this对象是运行时基于函数的执行环境(也就是上下文)绑定的. 从react中的 ...

  6. 使用React的static方法实现同构以及同构的常见问题

    代码地址请在github查看,假设有新内容.我会定时更新.也欢迎您star,issue,共同进步 1.我们服务端渲染数据从何而来 1.1 怎样写出同构的组件 服务端生成HTML结构有时候并不完好.有时 ...

  7. 前端技术之:使用webpack构建React程序配置方法

    package.json中需要引入以下依赖:   开发依赖: "@babel/core": "^7.1.2", "@babel/preset-env& ...

  8. React组件属性/方法/库属性

    1. propTypes 用于进行props的类型检查:来自于prop-types库. // V15.5之后 import PropTypes from 'prop-types'; 该方法适用于函数组 ...

  9. React Native startReactApplication 方法简析

    在 React Native 启动流程简析 这篇文章里,我们梳理了 RN 的启动流程,最后的 startReactApplication 由于相对复杂且涉及到最终执行前端 js 的流程,我们单独将其提 ...

随机推荐

  1. SD.Team主题形象小人偶

              W e ♥ S D     ♫ ♪ 咔咔咔~可能源码冲突会造成小人偶光头 :)

  2. GitHub+jsDelivr+PicGo 打造稳定快速、高效免费图床

    标题: GitHub+jsDelivr+PicGo 打造稳定快速.高效免费图床 作者: 梦幻之心星 347369787@QQ.com 标签: [GitHub, 图床] 目录: 图床 日期: 2019- ...

  3. css 盒模型、box-sizing 学习笔记

    默认情况下,给元素设置的高度和宽度是元素内容区的宽度和高度,给元素加padding 和 border ,元素的实际宽度和高度的计算方式是下面的两个公式: 元素的宽度= 元素的内容区宽度 + 内边距宽度 ...

  4. jchdl - GSL实例 - DFlipFlop(D触发器)

    https://mp.weixin.qq.com/s/7N3avTxTd2ZUnAcKg4w3Ig   D触发器对边沿敏感,只有当相应的边沿出现时,才会触发D的值传播到输出Q.   ​​ 引自:htt ...

  5. linux 最基本的命令

    1.说一些你比较常用linux指令 1.1.ls/ll.cd.mkdir.rm-rf.cp.mv.ps -ef | grep xxx.kill.free-m.tar -xvf file.tar.(说那 ...

  6. 一篇文章带你吃透 Docker 原理

    容器的实现原理 从本质上,容器其实就是一种沙盒技术.就好像把应用隔离在一个盒子内,使其运行.因为有了盒子边界的存在,应用于应用之间不会相互干扰.并且像集装箱一样,拿来就走,随处运行.其实这就是 Paa ...

  7. Java实现 LeetCode 725 分隔链表(暴力)

    725. 分隔链表 给定一个头结点为 root 的链表, 编写一个函数以将链表分隔为 k 个连续的部分. 每部分的长度应该尽可能的相等: 任意两部分的长度差距不能超过 1,也就是说可能有些部分为 nu ...

  8. Java实现 蓝桥杯 算法训练 出现次数最多的整数

    算法训练 出现次数最多的整数 时间限制:1.0s 内存限制:512.0MB 提交此题 问题描述 编写一个程序,读入一组整数,这组整数是按照从小到大的顺序排列的,它们的个数N也是由用户输入的,最多不会 ...

  9. 第三届蓝桥杯JavaC组国(决)赛真题

    解题代码部分来自网友,如果有不对的地方,欢迎各位大佬评论 题目1. 填算式 [结果填空] (满分11分) 看这个算式: ☆☆☆ + ☆☆☆ = ☆☆☆ 如果每个五角星代表 1 ~ 9 的不同的数字. ...

  10. java实现字符串比较

    标题:字符串比较 我们需要一个新的字符串比较函数compare(s1, s2). 对这个函数要求是: 1. 它返回一个整数,表示比较的结果. 2. 结果为正值,则前一个串大,为负值,后一个串大,否则, ...