Delete_89x的博客

nuxt3中使用NuxtColorMode，component加载不出来

Delete_89x — Sat, 23 Sep 2023 11:31:05 +0800

nuxt3中使用NuxtColorMode，component加载不出来

记录-小程序previewImage无法预览本地图片

Delete_89x — Thu, 19 Jan 2023 11:26:50 +0800

小程序previewImage无法预览本地图片

记录-解决element-plus自动引入后ElLoading、ElMessage、ElNotification、ElMessageBox样式丢失的问题

Delete_89x — Fri, 19 Aug 2022 19:05:35 +0800

vue3项目中使用element-plus自动引入遇到ElLoading、ElMessage、ElNotification、ElMessageBox样式丢失的问题。

Vue-cli报错：ERROR Invalid options in vue.config.js: “plugins“ is not allowed

Delete_89x — Sun, 14 Aug 2022 18:03:15 +0800

Vue-cli报错：ERROR Invalid options in vue.config.js: "plugins" is not allowed

vue记录-vue中使用lodash _.debounce防抖不生效原因，解决方案

Delete_89x — Fri, 17 Dec 2021 17:27:23 +0800

vue中使用lodash _.debounce防抖不生效原因，解决方案

vue记录-vue-router.esm-bundler.js:3295 Error: Invalid route component

Delete_89x — Sun, 05 Dec 2021 15:57:26 +0800

话不多说，直接上报错图下面是路由index.js,乍一看没毛病吧，vite也没报错，但是跳转的时候就会报错。 import { createRouter, createWebHashHistory } from 'vue-router'; const routes = [ { path: '/', name: 'Home', component: () =>import('../pages/home.vue'), }, { path: '/about

RangeError: Maximum call stack size exceeded，Vue路由无限循环跳转。

Delete_89x — Thu, 02 Dec 2021 16:55:11 +0800

RangeError: Maximum call stack size exceeded，Vue路由无限循环跳转。

vue-vant样式无法覆盖/无法重写的问题，vant额外类名的使用

Delete_89x — Fri, 26 Nov 2021 16:46:28 +0800

项目场景：以今天碰到的Field 输入框为例。问题描述：很明显，Field 输入框右边的input区域不对齐。不对齐怎么办，找到对应的样式，改样式呗。这里就是这个左侧title，带了一个flex:1样式的问题，手动给他取消看看这就没毛病了吧，对齐了，就是这个flex:1的问题但是在vue里直接class改样式没生效。不论是直接给van-field加class，用!important都改不掉，然后试了试文档上的label-class左侧文本额外类名，也是不行，明明知道是哪个样式有问题，但是改

记录-vant-DatetimePicker时间选择器，时间选择滚动区域消失。[class*=van-hairline]

Delete_89x — Wed, 17 Nov 2021 18:44:09 +0800

项目场景：今天项目引了vant-DatetimePicker时间选择器，前边还好好的，改了一写无关的文件，发现这时间选择滚动区域消失没了。问题描述：第一时间是找全局样式，看有没有被重写，没找着，也没重写，那就奇怪了。然后调试器看样式… 发现这玩意，东西是在的，但是跑偏了，没显示出来，看了一下布局，找到问题了。原因分析：这个组件的中间是有两条线的，这玩意占位。但是本来是没这个问题。这玩意身上带了个样式。就是这个东西顶掉了下边的绝对定位，影响了定位，导致其他元素显示异常。 [clas

vant 使用PullRefresh 下拉刷新组件时，无论滚动条在哪，总会触发下拉滚动

Delete_89x — Tue, 16 Nov 2021 21:47:23 +0800

今天遇到个问题，使用PullRefresh组件时，无论滚动条滚动到哪里，只要页面向下拉，页面的滚动条都还没到顶就触发下拉刷新在网上找了一下，可终于找到方法了。 .van-pull-refresh { height: calc(100vh - 100px) !important; overflow: auto !important; } .van-list { height: auto !important; } ...

Vue报错-[Vue warn]: Unknown custom element: ＜van-action-sheet＞ - did you register the component correc

Delete_89x — Tue, 16 Nov 2021 15:09:53 +0800

111

vant-List-@load事件一直触发

Delete_89x — Fri, 12 Nov 2021 10:04:05 +0800

项目场景：提示：这里简述项目相关背景：例如：项目场景：示例:通过蓝牙芯片(HC-05)与手机 APP 通信，每隔 5s 传输一批传感器数据(不是很大) 问题描述：提示：这里描述项目中遇到的问题：例如：数据传输过程中数据不时出现丢失的情况，偶尔会丢失一部分数据 APP 中接收数据代码： @Override public void run() { bytes = mmInStream.read(buffer); mHandler.obta

Vue3.x基础-4.v-if、v-show、v-for、v-once等指令

Delete_89x — Sat, 30 Oct 2021 17:16:01 +0800

文章目录前言一、v-if二、使用步骤1.引入库2.读入数据总结前言 Vue指令一般指的是带有v-前缀的特殊属性，除v-for 和 v-on以外指令属性的值预期是单个 JavaScript 表达式。指令根据其所绑定的值，响应式地作用于相应的DOM元素。一、v-if v-if是一个用于控制DOM是否渲染的指令，如果所绑定的值或者表达式成立即渲染相应DOM模块，反之则不渲染。 666 // 如果data中的sign为true则渲染该

Vue报错-npm ERR，missing script: serve npm ERR， A complete log of this run can be found in:

Delete_89x — Sat, 30 Oct 2021 17:11:22 +0800

项目场景： Vue项目启动报错，麻了，仔细一看发现文件夹路径不对。解决方案：使用cd命令切换到该vue目录下；或者用编译器重新打开正确的项目。比如我的项目文件夹的路径是D/Demo/TypeScriptDemo/Vue-demo/vue3-1 但是我用vscode打开的项目是Vue-demo而不是vue3-1，这时候直接使用命令启动项目就会报错，使用cd vue3-1进入vue3-1文件夹即可。 ...

Vue报错-[vue/no-multiple-template-root] The template root requires exactly one element

Delete_89x — Fri, 29 Oct 2021 15:03:21 +0800

123

Git-v2.33.1，报错

Delete_89x — Thu, 28 Oct 2021 13:19:44 +0800

项目场景：这两天Git疯狂搞事情，昨天还好好的，第二天就报错。。。 Permission denied (publickey). fatal: Could not read from remote repository 还有一个什么ssh-rsa的错误大概就是说我ssh密钥有问题，但是我重新生成添加密钥也解决不了 push代码时出现的错误remote: GitLab: The project you were looking for could not be found.To https://code

CSS图片底部留白的解决办法

Delete_89x — Wed, 27 Oct 2021 17:53:16 +0800

问题描述： div里放了个图片，底部留白，用了padding:0，没去掉，记录一下。原因分析： img元素默认是inline元素，而inline元素的vertical-align属性的默认值为baseline，也就是文字基线对齐，所以图片底部的留白就是baseline和bottom之间的距离。解决方案：使用display: block;将img转换成block元素即可。重写默认的vertical-align: baseline;，建议设置为vertical-align: middle; 设置图

Vue3.x基础-3.插值表达式

Delete_89x — Tue, 26 Oct 2021 22:41:05 +0800

插值表达式：说起插值表达式，可能有的都觉得不太熟悉，但是又听说过，自己也有印象，它也有另一个名字叫字面量，“Mustache”语法 (双大括号) 就是我们看到的{{msg}}这种东西。 msg标签的对应着Vue组件实例里data中某个变量的值，当绑定组件实例上的msg property 发生了改变，插值处的内容也会被更新。首先在data中定义一个变量： data: { msg: "678" } 这种语法不能使用在标签里，也就是不能作为标签的属性来写，如下的写法是错误的。

Vue3.x基础-2.生命周期函数

Delete_89x — Sun, 24 Oct 2021 16:53:13 +0800

前言生命周期函数也叫生命周期钩子，可以理解成在Vue实例的不同生命周期中自动调用执行的函数。官方图解：生命周期函数写法注意事项 Vue的生命周期钩子函数的this会自动绑定到Vue的示例当中，所以可以在生命周期钩子函数中通过this访问data中的数据或者调用methods中的方法等等。因此我们不必显式地使用箭头函数来定义生命周期方法(比如： created: () => {this.init()})，这将会导致init()方法无法在created生命周期中按照预期被调用，因为箭头函数绑定了

Vue3.x基础-1.Vue.createApp()与mount()

Delete_89x — Sun, 24 Oct 2021 10:08:40 +0800

Vue基础-1.createApp（）与mount（）前言一、pandas是什么？二、使用步骤1.引入库2.读入数据总结新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入前言哎呀今天在从头回顾Vue的过程中，言归正传，在传