摘要：
Enter与Output基础配置 需求一；我们需要将打包后输出两个js文件 module.exports = { mode: 'development', entry: { main: './src/index.js', sub: './src/index.js' }, entry可以接收一个对象， 阅读全文
摘要：
### webpack 介绍 * 什么是webpack<https://www.webpackjs.com/> * Webpack是一个模块打包器(bundler)。 * 在Webpack看来, 前端的所有资源文件(js/json/css/img/less/...)都会作为模块处理 * 它将根据模块 阅读全文
摘要：
function shallowRef(val) { return shallowReactive({value:val}); } function shallowReactive(obj) { return new Proxy(obj, { get(obj, key){ return obj[ke 阅读全文
摘要：
什么是 Proxy？ MDN 上是这么描述的——Proxy对象用于定义基本操作的自定义行为（如属性查找，赋值，枚举，函数调用等）。 其实就是在对目标对象的操作之前提供了拦截，可以对外界的操作进行过滤和改写，修改某些操作的默认行为，这样我们可以不直接操作对象本身，而是通过操作对象的代理对象来间接来操作 阅读全文
摘要：
利用readonly封装数据，递归只读 <template> <div> <p>{{state.name}}</p> <p>{{state.attr.age}}</p> <p>{{state.attr.height}}</p> <button @click="myFn">按钮</button> </ 阅读全文
摘要：
ref 过去在 Vue2 中，我们采用 ref 来获取标签的信息，用以替代传统 js 中的 DOM 行为。 <template> <div ref="box"> I am div </div> </template> console.log(this.$refs.box); 在 Vue3 的组合 A 阅读全文
摘要：
customRef 返回一个ref对象,可以显式地控制依赖追踪和触发响应 示例 <template> <div> <p>{{obj}}</p> <button @click="inc">button</button> </div> </template> <script> import { cust 阅读全文
摘要：
ref和toRef区别: ref->复制, 修改响应式数据不会影响原始数据 toRef->引用, 修改响应式数据会影响原始数据 ref->数据发生改变, 界面就会自动更新 toRef->数据发生改变, 界面也不会自动更新 toRef应用场景: 如果想让响应式数据和以前的数据关联起来, 并且更新响应式 阅读全文
摘要：
reactive类型数据代码 <template> <div> <p>{{state}}</p> <button @click="myFn">按钮</button> </div> </template> <script> import {reactive} from 'vue'; export de 阅读全文
摘要：
递归监听 默认情况下，Vue3 中的 ref 和 reactive 都是递归监听的(层级深的对象)，即能实时监听对象的底层变化。 例如，在 ref 中 <template> <div> <p>msg.a.b.c = {{msg.a.b.c}}</p> <p>msg.e.f = {{msg.e.f}} 阅读全文