「前端」React 16.4 开发简书项目从零基础入门到实战（慕课网个人学习笔记）持续更新中……

最新推荐文章于 2024-04-10 05:25:25 发布

Jack_WJQ

最新推荐文章于 2024-04-10 05:25:25 发布

阅读量3.7k

点赞数 3

分类专栏： # React学习记录文章标签： React.js Redux Node.js Node React

本文链接：https://blog.csdn.net/qq_26377547/article/details/87971188

版权

2-3 工程目录文件简介

PWA progressive web application：通过写网页的形式写手机APP
registerServiceWorker：将网页上线到支持https协议的服务器上，访问一次即可离线访问
index.js：整个React项目的入口文件 index.html：负责页面显示的html内容

2-4 React中的组件

import { Component } from ‘react’ 等价于 import React from ‘react’ const
Component = React.Component
ReactDOM将组件中的内容挂在到页面某个节点下
如果项目中使用到了JSX语法，一定要引用React
React组件一定要引用Component基类，React组件的render函数返回的内容也是JSX，同样要引用React

2-5 React 中最基础的JSX语法

3-1 使用React编写TodoList功能

React组件中render函数返回的内容只能是一个元素（即在最外层包裹一个标签）。如果想在最外层包一个不被显示的元素（即隐藏最外层的标签），需要引入Fragment，然后用Fragment占位符替换最外层包裹的标签

3-2 React 中的响应式设计思想和事件绑定

React作为响应式框架，并不直接对DOM进行操作，而是通过操作数据来改变DOM（React会感知数据的变化，自动生成DOM）
在js中，类一定会有一个constructor构造函数，当我们创建实例的时候，会优先于任何一个函数执行 3.
constructor函数会接收一个props的参数，super(props)用于调用父类的constructor函数
constructor(props) { super(props); … }
属于固定写法在js中，类一定会有一个constructor构造函数，当我们创建实例的时候，会优先于任何一个函数执行
constructor函数会接收一个props的参数，super(props)用于调用父类的constructor函数
constructor(props) { super(props); … }
属于固定写法constructor函数会接收一个props的参数，super(props)用于调用父类的constructor函数
constructor(props) { super(props); … } 属于固定写法
React中定义数据需把数据定义在状态中：this.state = {…}
在JSX中使用js的变量一定要使用{…}
React中事件绑定采用驼峰规则
页面中显示的内容由数据决定，要改变页面显示内容，只需要使数据发生变化
事件绑定时注意函数的作用域，通过bind(this)可以对作用域进行绑定
对this.state当中的数据进行修改不能使用引用的方式直接修改，需要调用this.setState方法对数据进行修改

3-3 实现 TodoList 新增删除功能

关注