react项目中的注意点

一、ES6 的编译方法

目前主流的浏览器还不支持ES6。 现在一般采用webpack 和 <script type="text/babel">对jsx  语法进行编译,编译成正常的js语言。type=‘text/babel‘   这个是引用babel.js库。

二、react 中有个PropTypes

在react中组件的属性可以接受任意值,字符串、对象、函数。有时,我们需要一种机制,验证别人使用的组件时,提供的参数是否符合要求。

三、虚拟的DOM

react 中最神奇的部分莫过于虚拟的DOM,以及其高效的Diff算法。当部分节点发生变化的时候,会想在虚拟的DOM上做出改变,然后在总体的反应到真是的DOM节点中。

四、react  中的purRender

import pureRender from ‘pure-render-decorator‘;  优化刷新,数据没有变化就不刷新。

时间: 2024-11-04 18:40:58

react项目中的注意点的相关文章

React项目中使用Mobx状态管理(二)

并上一节使用的是普通的数据状态管理,不过官方推荐使用装饰器模式,而在默认的react项目中是不支持装饰器的,需要手动启用. 官方参考 一.添加配置 官方提供了四种方法, 方法一.使用TypeScript,顾名思义该方法是项目使用typescript时的配置 方法二.使用babel-preset-mobx, 安装并添加到.babelrc配置中,该方法需要升级一些依赖, babel-core -> @/babel-core 7.x babel-loader -> @/babel-loader 8.

深入浅出TypeScript(5)- 在React项目中使用TypeScript

前言 在第二小节中,我们讨论了利用TypeScript创建Web项目的实现,在本下节,我们讨论一下如何结合React创建一个具备TypeScript类型的应用项目. 准备 Webpack配置在第二小节项目的基础上做了一些修改, 添加React相关依赖:react.react-dom.@types/react 和@types/react-dom 修改Webpack配置文件 修改webpack.base.config.js,其余文件和第二小节保持一致,修改如下: const HtmlWebpackP

react项目中遇到的BUG

前情提要:最近在学习react,然后就将项目中遇到的bug总结下来,作为借鉴! 项目结构: demo |app |app.js |main.js |center.js |toutiao.js |quanzi.js |shipin.js |dinggou.js |style.css |build |index.html |.babelrc |package.json |node_modules |webpack.config.js html文件: <!DOCTYPE html> <html

react项目中引用amap(高德地图)坑

最近在写一个react项目,用到了需要定位的需求,于是乎自己决定用高德地图(AMap),但是react官方文档的案列很少,大多都是原生JS的方法. 在调用amap的 Geocoder Api 时,一直不能从AMap对象下找到Geocoder 的方法, 后来花了几个小时的时间找问题在哪 结果在index中引入链接时,需要在链接上配置plugin=AMap.Geocoder, 才能够在AMap调用Geocoder Api. 下面是例子: <script type="text/javascrip

在React项目中添加ESLint

1. 安装eslint npm install eslint --save-dev // 或者 yarn add eslint --dev 2. 初始化配置文件 npx eslint --init //进入问题配置页面 完成后,添加react-hook的eslint插件 npm install eslint-plugin-react-hooks --save-dev // 或者 yarn add eslint-plugin-react-hooks --dev 并且在配置文件中添加配置项: //

怎么让VScode中的beautify插件不格式化react项目中的jsx代码

右下角,把语言模式 JavaScript 改成 JavaScript React 点击右下角的javaScript, 在弹出的选择框中, 输入选择JavascriptReact 原文地址:https://www.cnblogs.com/SRH151219/p/11137562.html

react项目中引入百度地图打包报错问题

一.我正常引入百度地图,调试时候是好使的,但是打包时候就报错 引入方法如下: 报错如图 正常调试是好使的,但是打包报这个错,解析不了这个BMap,那么怎么办呢? 然后我就转用了window办法,虽然因为实例而实例....挺可耻的 用法如图 原文地址:https://www.cnblogs.com/wenbodeboke/p/9828758.html

在react项目中启用mobx的配置方法

1.安装插件 npm install --save-dev babel-preset-mobx mobx mobx-react 2.package.json配置 { "presets": ["mobx"] } 参考:https://cn.mobx.js.org/best/decorators.html 原文地址:https://www.cnblogs.com/piaobodewu/p/10505614.html

react项目中CSS继承(CSS样式复用)

.green-flag { width: 2rem; height: 2rem; padding: 0.375rem; border-radius: 0.25rem; user-select: none; user-drag: none; cursor: pointer; } .green-flag:hover { //冒号:的含义是此样式的不同状态下 background-color: $motion-light-transparent; } .green-flag.is-active { /