oldwang1999的博客

在前端的开发当中，我们始终都要进行一些标签显隐，在vue中，由于vue.js的存在，我们可以使用v-if或者v-show对于一个标签进行显隐，而在React中，需要使用js中的判断语句去创建元素表示当前的状态，然后通过React来更新UI。import React from 'react';function Hello(props) { return <h1>hello world!</h1>;}function Hi(props) { return &

在组件创建、组件属性更新、组件被销毁的过程中，总是伴随着各种各样的函数执行，这些在组件特定时期，被触发执行的函数，统称为组件的生命周期函数。组件的生命周期一共有三个阶段：挂载、更新、卸载。1.挂载就是组件初始化的时候调用的方法，也就是说，这些方法在组件的生命中只能执行一次；2.更新就是组件的某部分属性或者状态发生改变，就会去执行的方法，在组件的生命中既可以执行0次，也可以执行多次；3.卸载就是在组件被销毁的时候执行的方法，执行之后就意味着组件的生命到头了，因此，在组件的生命中也只能执行一次。

React 元素的事件处理和 DOM 元素的很相似，但是有一点语法上的不同：React 事件的命名采用小驼峰式（camelCase），而不是纯小写。 使用 JSX 语法时你需要传入一个函数作为事件处理函数，而不是一个字符串。原生DOM的写法：<button onclick="handler">点击</button>React的写法：<button onClick={this.handler}>点击</button>在 React .

1.为什么不要直接对state进行赋值？如果直接对this.state复制是不会去更新视图的,this.setState的原理是同一个队列来实现state的更新的,将需要更新的state放入到状态队列中,在一定时间段之后,合并并更新state,然后进行渲染.而直接对this.state赋值是不会有这些操作的,因此不要对state进行直接赋值.2.this.setState为什么是异步的?this.setState的操作是异步的,是为了提升性能对state的更新进行批量操作,官方文档中的原话:

statestate是一个类函数组件的私有属性，只能由本组件初始化，由本组件修改和访问，不能被外部访问或者修改；如果更新它就会重新渲染用户界面，也就是说，用户的界面是随着state的状态改变而改变的。创建一个时钟：1.创建初始的时钟暴漏出来：Clock.jsimport React from 'react';class Clock extends React.Component{ constructor(props) { super(props);

组件react的组件有两种，一是函数组件，本质就是js的函数；二是class组件，是一个继承于React.Component的组件。1.函数组件function Welcome(props) {//组件名称必须要以大写开头，小写会被认为是html原生的标签 return <h1>hello {props.name}</h1>}函数接收一个参数就是组件的传入值。2.class组件class Welcome1 extends React.Comp..

jsx的学习以及超级简介：jsx既不是字符串也不是HTML；看起来像模板语言，但是JavaScript的全部功能；const element = <h1>Hello, world!</h1>;详情：https://www.tslang.cn/docs/handbook/jsx.html元素渲染：在下载并且安装react之后，就会出现最基本的元素渲染，下图是将多余文件和代码删除之后的结果，将引入的App.js的文件，暂时可以将App看成一个组件，将组件App.

安装reactnpm install -g create-react-app //安装脚手架create-react-app my-app //创建项目遇到的问题：An unexpected error occurred: “http://registry.cnpmjs.org/react: Hostname/IP does not match certificate’s altnames: Host: registry.cnpmjs.org. is not in the cert’s altn