庞囧的博客

什么情况下需要自己改写v-model的逻辑呢？基本的v-model已经不能满足我们的业务需求了用最普通的传值形式太麻了咱们看用最普通的传值形式有多麻烦。

vue3和vue2的自定义指令写法稍微优点不同，这里就优先记录vue3的，有2的版本代码也会贴出来。官方使用手册建议把这些自定义指令都放到全局上。

一般vue-loader干的活需要拉上几个好兄弟才行，vue-style-loader、vue-template-compiler、css-loader、sass-loader、less-loader、url-loader，PostCSS、MiniCssExtractPlugin等等。vue-loader是一个vue文件的翻译官，把vue文件翻译成浏览器能看懂的js。怎么翻译，自己一个人做不到，还需要兄弟的帮助。vue-loader不仅有最基本的工作，还能帮忙打一些黑工。

这篇文章可真是一场疯狂的打脸之旅！在从Vue转向React的过程中，我对这两个框架都有了一些独特的感受，导致我对它们之间的喜好一次又一次的发生变化。我会按照自己的思考记录下来，随着时间的推移，会有更多的感悟。然后我会回来更新文章，将之前的观点搁置一边（横线划掉），写上新的观点。看着这个过程，挺有趣的哈哈。个人感想纯主观，有错误或补充欢迎和平交流。

我个人平时的开发习惯还是会在子组件的类名前面加上前缀，例如父组件叫userCenter.vue，子组件的类名就取userCenter-box，以此类推。这样，直接能够让你的类名变成唯一的，也就是整个工程独一份的，这样无论是父子关系，兄弟关系，乱七八糟关系都不会影响到。因为在vue的渲染过程中，理论上是子组件先挂载完毕后，父组件才开始挂载，所以后者的样式把前者覆盖了。这时候，B组件的样式就不会影响到A组件了，父组件的样式也不会影响到A组件了。当A组件和父组件同时开启scoped，A组件的。

文章目录效果代码效果颜色小方块可以是个大组件，比如图表之类的，抛个砖~代码用transform属性，能很好的节省性能。<template> <main class="wrap"> <div class="item" style="transform: translate(-200%, 0%) scale(0.33)" @click="changeShowItemClick(0)"></div> <div

文章目录前言两个生命周期场景1场景2场景3补充前言在百度上搜这个问题，看到的答案都是相互复制粘贴的，而且个人觉得并没具体场景举例说明，并没有好的答案。于是自己立贴，留下这个坑，等日后遇到了一些场景，就把分析写在这里，把这个问题搞明白。两个生命周期created：data属性，methods属性，watch监听等都初始化好了，也就是可以使用了。mounted：已经把内存中编译好的模板替换到页面中，也就是视图层已渲染成最新的，vue 实例完全创建完毕。可以操作DOM，但不保证所有子组件都挂载了。场景

例如当一个首屏页面，其中有a组件做了按需引入，我们可以通过浏览器的Network记录查看，他同时拉取首页的资源和a组件单独打包的资源，但是要等首页拉取完毕后才去拉取a组件。使用这种script方式的效果是：当你用v-if渲染子组件或者浏览器浏览到的时候，才会去单独拉取该子组件的打包代码文件，可以通过浏览器的Network记录证实。页面中有较为复杂的组件，导致渲染过久。如果是路由组件做了按需引入怎么理解，其实很好理解，我们最外层不是有个App.vue，这个就相当于路由组件的父组件，所以逻辑和上面说的一样。

文章目录场景计算属性方案将if条件以至外一层场景例如以下场景：<ul> <li v-for=“user in users” v-if=“user.isActive” :key=“user.i’d”> {{item.name}} </li></ul>这里能明白是想只循环渲染出isActive为true的成员。这样做，虽然for比if 有更高的优先级，但会遍历出多余不显示的成员，每次数组一更新（无论是不显示成员的信息还是显示成员的信息）又要来一

文章目录问题场景beforeEach全局守卫底层函数劫持问题场景可能有些情况，我们需要路由从上游链带参数一直传下去，所以全局的路由需要动态自动添加固定参数。beforeEach全局守卫const query = { id: ‘1’ } //这是全局需携带的参数router.beforeEach((to,from,next)=>{ to.query.id ? next() : next({…to.query, …query}) //这句条件判断有一层的用意是，如果第一次加了参数后，会再次触