react
文章平均质量分 77
赏花赏景赏时光
这个作者很懒,什么都没留下…
展开
-
React学习笔记三:demo《中》
2、轮播图处理1)基本使用 a)打开antd-mobile的Carousel组件文档Carousel组件 b)选择“基本”,点击“</>”,显示源码 c)拷贝核心代码到Index组件中 d)调整代码,让其跑起来2)获取轮播图数据 a)安装axiosnpm i axios -S b)在Index组件中导入axios c)在state中添加轮播图数据:swipers d)新建方法getSwipers获取轮播图数据,并更新swipe...原创 2021-03-15 22:33:36 · 109 阅读 · 0 评论 -
react中常见错误收集
1、错误:index.js:3 Uncaught TypeError: Class extends value undefined is not a constructor or null截图如下:错误提示:类继承的值为undefined,不是一个构造器代码如下:将Component写成小写的component,就会出现下面的错误;或者将Component单词写错也会出现下面的提示...原创 2021-03-13 11:19:56 · 2542 阅读 · 1 评论 -
React学习笔记三:demo《上》
使用React做个小demo目标:1)初始化项目2)使用ant-mobile组件库3)完成项目整体布局4)完成首页轮播图5)使用百度地图API完成定位功能6)使用react-virtualized完成城市选择功能项目准备项目整体布局首页模块城市选择模块一、项目准备1)项目介绍核心业务:在线找房(地图、条件搜索)、登录、房源发布技术栈:a)React核心库:react react-dom react-routerrouter-dom...原创 2021-03-07 22:36:10 · 346 阅读 · 0 评论 -
react学习笔记二:react原理
一、react原理的初步了解:1)setState()的说明2)JSX语法转化3)组件更新机制4)组件性能优化5)虚拟DOM和diff算法1、setState()的说明作用:修改state,更新UI1)setState()异步更新数据this.state = { a: 0}this.setState({ a: this.state.a + 1})console.log(this.state.a)2)多次调用setState(),合并成一次r.原创 2021-03-07 15:40:19 · 195 阅读 · 0 评论 -
react学习笔记一:基础知识
react开发辅助工具chrome扩展包1、React Devtools:检视React组件树形结构:https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi2、Redux Devtools:检视Redux数据流:https://chrome.google. com/webstore/detail/redux-devtools/lmhkpmbekcpmknkli原创 2021-02-28 15:53:09 · 202 阅读 · 1 评论 -
直接操作DOM一定比虚拟DOM操作耗时,diff算法,key值,虚拟 DOM的定义
直接操作DOM一定比虚拟DOM操作耗时吗?或者一次直接DOM操作一定比一次虚拟DOM操作耗时吗?1)虚拟DOM的本质就是一个JS对象,虚拟DOM减少了真实DOM的操作,当修改数据的时候,就是修改虚拟DOM产生全新的虚拟DOM,新旧虚拟DOM使用diff算法,得到patch(也就是需要修改的部分),然后将这个patch打到浏览器的DOM上(减少重绘和回流,从而达到性能优化的目的...转载 2019-03-13 21:54:45 · 2998 阅读 · 1 评论 -
react项目中遇到的bug
1、react-router使用时,在浏览器出错:Attempted import error: 'Link' is not exported from 'react-router 源代码如下: import React, { Component } from 'react';import {Menu} from 'semantic-ui-react';import 'seman...原创 2019-01-10 10:06:23 · 24543 阅读 · 1 评论 -
React组件定义种类,容器型组件,展示型(UI)组件,受控组件,props和state的区别,setState
创建组件有两种方法:注意:用function构造函数创建无状态组件,只有props,无自己的私有数据和生命周期---用的不多;注意:class关键字创建有状态组件,有自己的私有属性(this.state)和声明周期---用的比较多有状态组件和无状态组件的本质区别:有无state属性、有无生命周期类组件(class component)和函数式组件(functional c...翻译 2019-03-13 20:29:47 · 812 阅读 · 0 评论 -
FAQ in react,react-transition-group
AJAX AND APIs1、在React中如何调用AJAX?使用AJAX库:Axios, jQuery AJAX,the browser built-in window.fetch 2、应该在那个生命周期函数中调用AJAX获取数据?在生命周期函数componentDidMount()中调用AJAX,并且可以调用SetState()设置state//API返回的JSO...转载 2018-12-27 15:40:44 · 334 阅读 · 0 评论 -
生命周期函数、redux的使用(一)
在定义React组件的时候,render()函数返回的html必须只有一个根元素,要想这个根元素不显示并且不占据页面空间,可以从react中引进Fragment组件JSX语法细节在JSX里面写注释的方法:多行注释:{/*注释注释*/}单行注释:{//注释注释}属性:dangerouslySetInnerHTML={{_html: item}}可以让内容ite...翻译 2019-03-13 22:03:20 · 4805 阅读 · 0 评论 -
库和框架,vue和react的比较
库和框架,vue和react的比较库:小而巧,只提供API,可以方便的从一个库切换到另外一个库,代码几乎不需要改变框架:大而全的是框架,,框架与框架之间的切换比较困难vue和react的比较一)组件化方面1)什么是模块化模块化是从代码的角度进行分析,把一些可复用的代码,抽离为单个模块,便于项目开发和维护2)什么是组件化组件化是从UI界面角度进行分析,把一些可...翻译 2019-01-10 19:52:56 · 3187 阅读 · 0 评论 -
API reference about React
<一>React1、Components作用:将UI分成独立的模块,使独立的模块可以重复使用Components的定义方式:1)使用ES6子类语法,React.Component、React.PureComponent2)不使用ES6子类语法,使用模块create-react-class3)可以定义成函数React.memo A、React.compon...转载 2018-12-26 10:14:49 · 368 阅读 · 0 评论 -
main concepts about react
1、React一共有三个js文件,必须首先加载: <script src="../build/react.js"></script> <script src="../build/react-dom.js"></script> <script src="../build/browser.min.js"翻译 2018-12-24 19:56:23 · 295 阅读 · 0 评论 -
React Bootstrap
react-boostrap是用React重建的bootstrap,完全不依赖于bootstrap和jQuery1、安装npm install react-bootstrap@next bootstrap2、importing要用到哪些component就引进具体的component,这样可以减少代码量import Button from 'react-bootstrap/...翻译 2018-12-28 10:35:35 · 3838 阅读 · 0 评论