1-使用React的方式
认识 React
React是一个用于构建用户界面的 JAVASCRIPT 库。(JQuery也是)
React主要用于构建UI,很多人认为 React 是 MVC 中的 V(视图)。mvvm
React起源于 Facebook 的内部项目。
语法:
React 使用 JSX (js xml)来替代常规的 JavaScript
JSX是javascript的语法糖
我们不需要一定使用 JSX,但它有以下优点:
1,JSX 执行更快,因为它在编译为 JavaScript 代码后进行了优化。
2,它是类型安全的,在编译过程中就能发现错误。
3,使用 JSX 编写模板更加简单快速。
jsx模板 const temp = <h1>hello</h1>; Let a = <div> <h1></h1><h2></h2> 最外头一定要一个根标签包裹住子标签,注意模版中的标签都要闭合 </div>
使用React的两种方式:
1,直接在html端 使用script方式引入 babel,react,reac_dom js文件
效率低,因为要实时转化

2,安装脚手架,以项目的方式使用react
Package.json中 是项目下载包依赖的记录
安装步骤:
安装create-react-app
cnpm instal -g create-react-app //全局安装脚手架
创建项目
create-react-app app(项目名)
启动项目
cd app
npm start //yarn start
安装cnpm
npm install -g cnpm
对于使用别人的项目,一般是不会把nodelmodel(放项目依赖的文件夹)传给你的(因为太大),所以首先先下载好该项目的依赖,通过npm install 会自动根据packge.json文件中的记录下载依赖 ,之后启动项目即可 。
声明组件的方式有两种:
1,函数声明
函数名必须大写,才表示是组件,否则浏览器认为是html元素
组件中return返回的是一个模版。
第一个参数是组件(或者说是react元素),第二个参数是dom节点

2,类声明
1-使用React的方式的更多相关文章
- React.js入门笔记(续):用React的方式来思考
本文主要内容来自React官方文档中的"Thinking React"部分,总结算是又一篇笔记.主要介绍使用React开发组件的官方思路.代码内容经笔者改写为较熟悉的ES5语法. ...
- 将HTML页面自动保存为PDF文件并上传的两种方式(一)-前端(react)方式
一.业务场景 公司的样本检测报告以React页面的形式生成,已调整为A4大小的样式并已实现分页,业务上需要将这个网页生成PDF文件,并上传到服务器,后续会将这个文件发送给客户(这里不考虑). 二.原来 ...
- react引入方式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 移动web端的react.js组件化方案
背景: 随着互联网世界的兴起,web前端开发的方式越来越多,出现了很多种场景开发的前端架构体系,也对前端的要求日益增高,早已经不是靠一个JQuery.js来做前端页面的时代了,而今移动端变化最大,近 ...
- React,React Native中的es5和es6写法对照
es6用在React中的写法总结: 在es6还没有完全支持到浏览器的阶段里,已经有很多技术人员开始用es6的写法来超前编程了,因为有转义es6语法的工具帮助下,大家才可大量使用.解析看看es6写法用在 ...
- React Native at first sight
what is React Native? 跟据官方的描述, React Native是一套使用 React 构建 Native app 的编程框架. 推出不久便引发了广泛关注, 这也得益于 Java ...
- React.js入门笔记
# React.js入门笔记 核心提示 这是本人学习react.js的第一篇入门笔记,估计也会是该系列涵盖内容最多的笔记,主要内容来自英文官方文档的快速上手部分和阮一峰博客教程.当然,还有我自己尝试的 ...
- React学习系列一
系列学习react 翻译地址 https://scotch.io/tutorials/learning-react-getting-started-and-concepts 我是初学者,英语也不是很好 ...
- React组件
React组件 组件是React中的基本单位,在每个组件里面又封装了程序逻辑,通过reader标出界面片段或者回传一段描述,组件再通过React.renderComponent将组件展示在浏览器中.每 ...
随机推荐
- 洛谷P1044栈(DP)
题目背景 栈是计算机中经典的数据结构,简单的说,栈就是限制在一端进行插入删除操作的线性表. 栈有两种最重要的操作,即poppoppop(从栈顶弹出一个元素)和pushpushpush(将一个元素进栈) ...
- vs rdlc 设置Tablix 在新页面重复表头
设置方法: 1.选中Tablix控件 2.点开三角形 3.选择高级模式 4.在行组 下 选择静态,然后看右边的属性 5.将属性设置为如下 就可以让Tablix控件实现在新页中带表头
- 作业2:go实现一个压测工具,具备upload功能
作业:go实现压测工具,具备upload功能. upload内容是.tar.gz,使用http协议上传. 要求:upload的文件名,http目的地址灵活可配. deadline:2019.4.30
- 远程控制服务:配置sshd服务,密钥验证登陆
配置sshd服务 1.概述: SSH(Secure Shell)是一种能够以安全的方式提供远程登录的协议,也是目前远程管理 Linux 系统的首选方式.在此之前,一般使用 FTP 或 Telnet 来 ...
- 在linux下安装java(centos和ubuntu)
在本地测试环境安装插件,发现还得用到java,虽说是个程序员,可是没用过java啊,哎,但是插件得用啊,怎么办啊?自己装呗 一.自己的系统:CentOS 7 1.查看CentOS自带JDK是否已安装. ...
- UTC/GMT/CST/RTC
GMT:格林尼治标准时间,是指位于伦敦郊区的皇家格林尼治天文台的标准时间,因为本初子午线被定义在通过那里的经线.也就是零时区的时间. UTC:世界协调时间,是一个时间系统.可以理解为这个地球的标准时间 ...
- ajax中 踩过的坑
直接上图: 以前一直对 dataType 这个参数 模棱两可,只知道一般写的是 json 正解:这个dateType 指的是 ajax 返回数据的格式.比如:你想返回一个“success& ...
- java 实现一段文字中,出现次数最多的字
代码如下: public static void main(String[] args) { String str = "大批量,之前都没怎么注意过,这个问题确实不会,网上参考了下别人的,大 ...
- 【C语言】赋值运算中的类型转换
#include<stdio.h> int main() { int a, b; double x = 1.54; char ch; a = x; x = ; b = 'a'; ch = ...
- 纯CSS实现吸顶效果
position的属性有哪些? { position: static; position: relative; position: absolute; position: fixed; pos ...