摘要:
在实际开发中,由于项目一开始设计的一些不合理性,会在组件中通过 html[media=pad]{ .xxx{ /* 组件样式 */ } } 以上方式修改某些组件的样式,这样会涉及到从 html 层级选择,由于我 style 标签是这样写的 <style lang="less" scoped></st 阅读全文
摘要:
vue3 项目中,使用 vue 常用的 api 比如 vuex 的 api 或者 ref,reactive 等,以及导入多个自定义组件、UI 组件库的组件,都需要反复的手动导入,注册,很是影响开发体验,这里推荐 antfu 开源的两个插件,上链接: 自动导入组件 https://github.com 阅读全文
摘要:
unplugin-auto-import的配置和eslint报错解决先上官网:unplugin-auto-import unplugin-auto-import 解决了vue3-hook、vue-router、useVue等多个插件的自动导入,也支持自定义插件的自动导入,是一个功能强大的typesc 阅读全文
摘要:
代码: // 自动导入插件 const autpImport = require('unplugin-auto-import/webpack')(...autoImportConfig) 报错 TypeError: Found non-callable @@iterator 原因: 使用 ... 扩 阅读全文
摘要:
document.documentElement.getAttribute('data-xxx') 阅读全文
摘要:
mac 下 nvm install v12.22.12 时,始终限制安装失败,解决方案,做好以下两件事: 将镜像源更换位淘宝镜像源 将终端 app 右键显示简介,勾选 rosetta 重启终端即可 参考 https://blog.csdn.net/xinshou_caizhu/article/det 阅读全文
摘要:
IDFA全称 Identifier For Advertising, 一个跟device相关的唯一标识符,可以用来打通不同app之间的广告。比如你在淘宝里搜索了某个商品之后,你在用浏览器去浏览网页的时候,那个网页的广告就会给你展示相应的那个商品的广告。当然你可以重置你的IDFA,使别人不能再trac 阅读全文
摘要:
副作用刷新时机Vue 的响应性系统会缓存副作用函数,并异步地刷新它们,这样可以避免同一个“tick”中多个状态改变导致的不必要的重复调用。 同一个“tick”的意思是,Vue的内部机制会以最科学的计算规则将视图刷新请求合并成一个一个的"tick",每个“tick”刷新一次视图,比如a=1;b=2;只 阅读全文
摘要:
toRefs 是为了避免对一个响应式对象解构的时候,解构后的每个属性不具有响应性 toRef 是为了针对单独获取某个对象的属性的时候保持响应性,从而单独对某个对象的属性进行响应式转化 针对 reactive 或者 ref 创建的响应式对象都可以使用这两个 api 进行转化 注意:toRefs只能对第 阅读全文
摘要:
const arr1 = ref([]); const arr2 = reactive([]); const obj1 = ref({}); const obj2 = reactive({}); watchEffect(() => { console.log("watchEffect arr1", 阅读全文
摘要:
获取dom的ref元素名称,要对应暴露的名称,不然会出现无效的dom报错,也就是拿到的是null 在setup中,使用ref(null)获取dom 不能直接在setup里面拿到dom的值,因为setup对应的生命周期是created,所以必须在后续的生命周期钩子里面拿到,比如onMounted 注意 阅读全文
摘要:
知识点 storeToRefs# ▸ storeToRefs<SS>(store): ToRefs<StoreState<SS> & StoreGetters<SS> & PiniaCustomStateProperties<StoreState<SS>>> 创建一个引用对象,包含 store 的所 阅读全文
摘要:
问题 在 vue3 + pinia 开发中,使用了自定义指令 directives,指令实现在独立的 js 文件中,想通过监听 dom 元素的变化修改 pinia 的 state 状态,直接在初始化调用 store 函数, directives/index.js import { useLayerS 阅读全文
摘要:
html <div v-for="(layer, index) in layerList" :key="layer.id" class="layer-item"> <div>{{ layer.name }}</div> </div> JavaScript 解决方案 1 : 给 state 增加 co 阅读全文
摘要:
报错信息如下: Vue received a Component which was made a reactive object. This can lead to unnecessary performance overhead, and should be avoided by marking 阅读全文
摘要:
背景 实际开发项目中,有些时候我们需要通过全局注册多个自定义组件,但是每个组件都导入一次,将会导致代码很冗余。 实现方案 customComponents/index.js const modules = import.meta.glob("@/customComponents/*.vue"); c 阅读全文
摘要:
在开发的过程中,外层盒子高度不确定的情况下,想要跟内层图片高度保持一致,内层图片高度设为width:100%;height:auto;外层box高度也是width:100%;height:auto.为什么会比图片本身到高度超出去一部分呢?外层box如何可以跟内层不确定高度的图片高度保持一致呢? <! 阅读全文
摘要:
背景 在 vue3 中,如果使用 component,可以动态加载一个组件,例如 <!-- 直接创建 --> <component :is="Image" /> 这样会将已经定义好并导入的比如 Image 组件加载出来,但是如果将需要展示的自定义组件放在一个数组中,遍历展示,则无法展示成功。 <!- 阅读全文
摘要:
function foo(){ console.log(a) } function bar(){ var a = 2; foo(); } var a=1; bar(); 请说出上题最终会输出 a= ? 解析:词法作用域让 foo() 中的 a 通过 RHS 引用用到了全局作用域中的 a,因此会输出 阅读全文
摘要:
在日常开发中,我们经常会用到 escape 和 encodeURI 和 encodeURIComponent 这三个方法对 url 或某些字符串进行转义,那这三个方法有什么区别呢? escape 官方文档:https://developer.mozilla.org/zh-CN/docs/Web/Ja 阅读全文