PureComponent 组件优化PureComponent 组件优化Component 的 2 个问题 只要执行 setState(),即使不改变状态数据, 组件也会重新 render() ==> 效率低 只当前组件重新 render(), 就会自动重新 render 子组件，纵使子组件没有用到父组件的任何数据 ==> 效率低 效率高的做法 只有当组件的 state 或 props 数据发生改变时才重新 ren 2022-02-28
Hooks 详解HooksReact Hook/Hooks Hook 是 React 16.8 版本后新增的特性/新语法 可以让函数式组件使用 state 以及其他 React 特性 注意点不要在循环，条件或嵌套函数中调用 Hook， 确保总是在你的 React 函数的最顶层以及任何 return 之前调用他们。遵守这条规则，你就能确保 Hook 在每一次渲染中都按照同样的顺序被调用。这让 React 能够 2022-02-28
ContextContext 用于组件、或说为子孙组件、多级组件之间的传递 –首先需要在全局创建一个 context，createContext(defaultValue?) 该defaultValue，只会在内部组件 没有接收到 provide r 的 value 时 才会生效。 –从中解构出 context 需要的组件 使用 provider 包裹 一个组件，其传递的 value 的值，可以传递到 2022-02-28
工具以及库推荐工具以及库推荐工具以及库推荐 nanoid 生成唯一 id 标识 npm i nanoid 引入 import {nanoid} from ‘nanoid’ 使用 nanoid() prop-types 对 prop 进行限制 很多平台都支持：vue\小程序… import PropTypes from ‘prop-types’ npm i prop-types querystri 2022-02-28
动态组件、异步组件、递归组件动态组件、异步组件、递归组件动态组件 多配合 keep-alive** ****使用** 多使用 componet 组件 用 v-bind 的 is 绑定 组件名，或通过 v-for 遍历 后端或 data 中动态请求来的数据。 异步组件 首次刷新 所有组件代码都会被下载下来。 使用异步组件，该异步组件需要时才会被加载。可以理解为懒加载。 使用 webpack 提供的 im 2022-02-28
组件挂载顺序组件挂载顺序vue 父子组件加载顺序 父 beforeCreate 父 created 父 beforeMount 子 beforeCreate 子 created 子 beforeMount 子 mounted 父 mounted 子组件若有 props 的话更新顺序是四步，若无的话两步不触发父亲的钩子。 父 beforeUpdate 子 beforeUpdate 子 updated 父 u 2022-02-28
vue底层vue 底层runtime 1. runtime-compiler (vue1.0) Vue 程序运行过程 template–>ast(虚拟语法树)–>render(渲染)–>vdom(虚拟 dom)–>UI(实际页面) 2. runtime-only (vue2.0) 所有 vue 组件中的 template 都被 vue-template-compiler(这个包脚 2022-02-28
vue-cli详解vue 脚手架详解Vue 框架开发 CLI [vue 脚手架中 webpack 的配置](vue 脚手架中 webpack 的配置.html) 2.0（旧版本）还得再安装 npm install @vue/cli-init -g 创建 cli2 vue init webpack 项目名称 启动 项目目录 npm run dev 手动打开或关闭 Eslint 语法规范 true 就是打开 2022-02-28
vue双向绑定原理vue 双向绑定原理数据劫持： vue.js 是采用数据劫持结合发布者-订阅者模式的方式，通过Object.defineProperty()来劫持各个属性的setter,getter,在数据变动时发布消息给订阅者，触发相应的监听回调 **观察着模式(observer) **是一对多的模式，就是他让 Object.defineProperty()的 双向绑定更有效率 Object.defin 2022-02-28
vue cli3 分环境打包vue cli3 分环境打包详情步骤 需要注意 2 点： 1、cli2 创建项目生成的 config 文件里的 env 文件是 js 后缀 2、cli3 创建自定义 env 文件的话不需要 js 后缀 打包时线上环境可能分多种，比如测试环境和生产环境等等。 直接上步骤。 一：package.json 添加 “build-test ”build-prod”:123456"scripts& 2022-02-28