嫒薇笑的博客

重点：ref=“formRef”（组件名）用于提交时检查表单是否通过验证；prop="name"用于定位验证规则是哪个属性；

意味着在模板渲染过程中尝试访问了一个名为“index”的属性，但是这个属性在Vue实例中并没有定义。它表示在渲染过程中尝试访问组件实例上不存在的属性linkTags。虽说错误很低级，但确实没报错，所以也就没发现。1、遇见报错，但也没啥影响，不知怎么回事。解决办法：在该属性前，加个v-if判断。我看看到底哪里没有定义。可是我没写过这东西啊。

还有一个小问题，清除文件列表不能放在成功回调函数里，这样的话连眼下上传的图片都会被清除掉。问题：打开弹窗，上传一张照片后，关闭再打开，之前上传的图片仍在列表里展示。然后添加了几行代码，报错。接下来就是改bug了……加上组件名就没问题了。

1、使用npm安装yarn。2、修改npm镜像源。

修改：此路径 node_modules/.bin/vue-cli-service.cmd 中的文件。查了查，说是nvm下载的npm安装包不全，有残缺。尽力查找原因，但项目能打开，只是服务器端报错500……折腾好久，最后从淘宝镜像下载zip替换掉nvm下载的文件夹里的东西，可以成功运行了。算了，换台机器，重新安装一下node，再试试，看看是环境问题还是代码问题。接下来我直接从淘宝镜像下载14版本的，复制到nvm中去，看看行不行。好，不报431了，报后端端口异常！太生气了，但没办法，继续解决。

原因是国内网络限制，解决方法是修改nvm的settings.txt文件，指向淘宝镜像源。原来的 https://registry.npm.taobao.org 已替换为 https://registry.npmmirror.com。折腾半天也没成功，于是卸载了node，开启安装nvm之旅，继续报错。2、为同时拥有两个类的元素设置样式，组合选择器是通过在选择器中并列写入两个类名来实现的，并且它们之间不含空格。接下来就要安装老版本的node了，看看能不能解决我刚刚的问题。切换成低版本node，项目还是报错了。

给.el-scrollbar加了一个边框后，发现有数据的时候table右侧的边框多了一层；无数据的时候，右侧body部分没有边框，滚动条出现，滚动到最右侧，边框才出现。说明给el-scrollbar加边框是有问题的，果断去掉。原因：中的组件不能呈现动画的非元素根节点。也就是说，Transition包裹的必须是一个单根的组件。2、el-table在无数据情况下，出现横向滚动条，大概跟边框的设置有关系。

3、修改elementplus中的table背景色和边框。2、打开页面后，跟开着定时器一样连续不断报错。1、echarts根据窗口大小变化。不知道为什么，刷新就好了。

废话不多说，直接上代码。首先是html模块代码。接下来是逻辑代码部分。

2、监听响应式的对象中的某个属性。写成函数返回值的形式又无法监听到具体属性的变化，所以最好写成函数返回值的形式，再加deep深度监听的设置。扩展运算符不能够在对象中使用，只能在可遍历的对象中使用（iterables），iterables的实现是依靠【symbol.iterator】函数，目前es6只有Array，Set，String内置了【symbol.iterator】方法。5、使用ref和reactive定义出来的数据无法使用扩展运算符，会报以下错误，因为打印出来的数据是proxy对象。

4、watch：若想监听对象的属性，需要深度监听，设置deep:true，若想立即执行监听函数，需要设置immediate:true（第一次执行时新值就是当前值，旧值是undefined）。注：如果监听的是reactive定义的对象类型数据，默认是开启深度监听的，并且关不掉。5、用ref()和reactive()修改整个对象。2、css设置背景色的简写形式，属性值的顺序。3、vue3解除监视。

参考文章https://blog.youkuaiyun.com/jieyucx/article/details/140636857。好的，虽然代码写得不多，但任务完成量可以了！解决：传输的参数要用连字符，不能用驼峰式写法。组件文件忘了写后缀.vue。3、算是警告吧，ESlint的格式问题。2、明明地址写对了，但报错找不到模块。4、Vue 3 中的拖拽排序功能实现。1、写组件时，关于引入子组件的报错。

设置地址栏图标（favicon）通常是通过链接标签（link）实现的，需要将favicon.ico文件放置在网站的根目录下，然后在HTML的部分引入它。把border/background等的样式写在el-col元素上，间距显示不出来，需要写在el-col元素的子元素div上，才能正常显示出间距。3、elementPlus中:gutter="20"不生效。这几天写的东西都好简单，把重心要放在我的架构师考试上了。2、css设置地址栏图标。1、css3背景色渐变。

老老实实躺平搬砖是绝对不行的，因为前端技术更新换代很快，并且AI的发展，开源产品的应用绝对会降低市场对前端程序员的需求。这次换成了一个比较成熟的框架RuoYi-Vue-Plus，这个框架几乎能满足百分之八十的前端管理系统的开发。前端代码的地址是：https://gitee.com/JavaLionLi/plus-ui#-1。突然感觉自己费劲搭建的项目、铺的页面、写的功能很没有意义。废话说了很多，今天就开始RuoYi-Vue-Plus的开发和应用吧！2、复习了一下怎么修改地址栏上的小图标。

原因是上面的某行代码标点没写……1、清除画布上原来的内容。

在TypeScript中，通常约定未使用的参数使用下划线(_)开头来命名，表示这个参数是有意不使用的。这样可以避免未使用参数的警告，同时清晰地表明这个参数是被忽略的。1、使用vscode遇到一个很难受的问题，就是鼠标滚动时，前几行代码就会定住。解决：点击左上角“查看”——外观——取消“粘滞滚动”。3、重启项目，又遇报错。这是一个非常低级的错误，但目前我遇到的好像都是低级错误~今天在整验证码功能，bug量还行。解决办法：选中浏览器中的停用缓存。2、写了一个三元表达式，成功报错。5、生成0-9的随机数。

但就又出现了一个问题，scss文件里的变量成功被引用，但文件中的样式全都不生效了。我发现，在main.ts文件中随便引入一个其他的scss文件，问题就解决了。在 vue3 项目中，用的是 scss 语言，在使用穿透语法时，报了警告而非报错。6、在views下的index文件中引入components/Sidentify，报错。在vite.config.ts文件中添加扩展，保存后重新运行，问题解决。添加了env.d.ts文件，并写入以下内容，并没有用。7、在Sidentify.vue文件中，继续报错。

改bug的路上

工作中的bug记录

从零搭建vue3项目

mac 安装pnpm成功，查看版本报错pnpm: command not found。