自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(120)
  • 问答 (1)
  • 收藏
  • 关注

原创 修改el-table中某一行样式,解决修改样式无效的问题

列表展示项目信息,其中,根据后端接口字段返回的项目状态task_status,延期项目底色换成浅黄色,预警项目底色换成粉红色。① 在公共样式文件里面写好样式②在js文件里面写个样式对应的map③在vue文件中导入公共样式文件和js文件④在el-table中动态绑定row-class-name⑤在methods中写动态获取样式名的方法。

2024-04-22 14:35:35 119

原创 element的el-table表格自定义表头解决数据不更新问题

element 官网上el-table上使用插槽 slot=“header”来实现自定义表头,在需要动态更新表头数据时,出现无法实时更新的情况,只需要将slot=“header” 改成#header ,效果就正常了。通过插槽传入表头,但是,如果我把表头初始值赋值为null,虽然可以正常显示表头,但是一开始会报错;如果我把表头初始值给列出来设计好的字段="",那么获取到后端返回的数据后,表头并不会自动更新!需要生成一个表格,表头由后端返回,自定义生成。

2024-04-11 16:01:25 340 1

原创 vscode配置之Vue开发者极度舒适的自定义配置

很喜欢的一套颜色配置,记录一下。还挺喜欢commit信息emoji的配置。

2024-04-09 10:13:43 101 1

原创 TypeScript 学习笔记

概述TypeScript可以看成是JavaScript的超集,主要提供了类型系统和对ES6的支持所有JavaScript脚本都可以当作TypeScript脚本(但是可能会报错),此外它再增加了一些自己的语法。类型类型指一组具有相同特征的值。如果两个值具有某种共同的特征,就可以说它们属于同一种类型。一旦确定某个值的类型,就意味着这个值具有该类型的所有特征,可以进行该类型的所有运算。凡是适用该类型的地方,都可以使用这个值;凡是不适用该类型的地方,使用这个值都会报错。TypeScript 是在开发阶段报错。

2024-04-08 09:59:59 449 1

原创 Vue组件封装重要知识点

通常,父组件通过props向下传递数据给子组件,而子组件则通过事件$emit向上发送消息给父组件.有时,我们可能希望子组件能直接修改某些由父组件传递下来的props,而不需要显式地触发一个事件来通知父组件更新这些值。场景:当前,有一个多处使用的弹窗,里面的左半部分是动态变化的,右半部分是统一的,我们需要动态配置左边,所以可以把左边区域的整块内容挖空,在使用到dialog的地方通过插槽去配置。父组件会通过props向下传数据给子组件,当子组件有事情要告诉父组件时,会通过$emit事件告诉父组件。

2024-04-01 15:10:11 718

原创 Vue3学习笔记

2020年9月18日,Vue.js发布3.0版本,代号:One Piece(海贼王)2 年多开发, 100+位贡献者, 2600+次提交, 600+次 PR、30+个RFCVue3 支持 vue2 的大多数特性可以更好的支持 Typescripthook本质是一个函数,使用 Vue3 的组合 API 封装的可复用的功能函数。类似于vue2.x中的mixin。自定义hook的优势: 复用代码, 让setup中的逻辑更清楚易懂。

2024-03-23 10:06:13 711

原创 Vue中通过v-for循环列表,绑定不同的点击事件和选项

【代码】Vue中通过v-for循环列表,绑定不同的点击事件和选项。

2024-03-18 18:44:23 373

原创 踩坑:npm run build会打包本地未提交的代码

如果你修改了代码,但没有提交这些修改到版本控制系统(如Git),那么当你运行npm run build进行打包时,这些未提交的修改。如果不希望未提交的代码被打包,那么应该在执行打包操作之前,将未提交的代码进行提交,或者将它们从项目中移除。即使你没有提交代码,npm run build命令仍然会打包你工作目录中的所有文件,包括未提交的修改。在本地执行npm run build时,会打包当前项目目录下的所有代码,包括已提交和未提交的代码。第一次知道原来打包是会把本地所有代码一起打包的,不管有没有提交。

2024-03-16 15:29:00 393

原创 Vue组件封装方案对比——v-if方式与内置component方式

先单独封装好各种类型的表单控件小组件,再通过来动态渲染,保证高度的组件复用性和扩展性,并避开v-if判断;对配置的数据结构进行调整使其更扁平化,降低使用门槛并提高开发效率。 高复用性:通过单独封装各种类型的表单控件小组件,实现了高度的组件复用 灵活性:通过封装各种表单控件小组件,可以确保每个组件都具备较高的可重用性和可扩展性。同时,使用可以根据配置动态渲染不同的组件,提供了更大的灵活性 易于维护:每一种特定的表单控件都有独立

2024-03-16 14:38:13 1154

原创 git push解决办法:! [remote rejected] prod -> prod (pre-receive hook declined)

今天想把最近改的东西上传到Gogs上发版一下子的,但是发现有冲突合并不了,于是我切回自己的分支合并了prod,把冲突处理了一下子,还又增加了一点修改,push后.......又回到prod进行git push,哦豁~这就出了问题了。可以看到,git push不上去的原因是:所push的分支prod是受保护的,为protected。

2024-03-12 14:38:45 316

原创 踩坑:直接npm run upload导致test代码上传到prod上

今天正式服突然出了问题,F12打开一看,是有些打包的资源404了,于是来到项目中的dist一看,报错的那些文件,都存在,想着打包好的dist已经有了,那就直接upload上传......结果是!它可以把打包和上传流程连在一起,并且通过代码控制test分支的代码只能上传test,而prod分支的代码只能上传prod,避免了人为误操作,把别的分支的代码覆盖到prod上去。原因是这样的:昨天我发版了测试服,因此,当前本地打包的代码是test分支的,我直接上传,就把test的代码都给发到prod上去了。

2024-03-08 11:05:19 185

原创 Git误操作补救错失:恢复误删的本地分支、将某个提交从一个分支复制到另一个分支

作为一枚强迫症,没用的分支总是喜欢及时删删删删掉删掉统统删掉,结果今天发现有些分支还是应该保留。比如,①前段时间切了个分支用来专门做图表,但因为需求还没有最终确定,已经上线了测试服而没有上正式服。②现在需要对那部分图表进行改动,就发现本地除了测试分支外,其它分支都没有图表相关代码了。③如果从测试分支切一个出来修改,又会有新的问题:等到上线的时候,我这个分支需要合并到prod中,那就相当于将test分支的一些代码也给合并到prod了,那可真的是太太太太危险了!!!所以,只能是把之前的分支找回来。

2024-03-07 15:17:49 455

原创 Vue动态绑定样式

虽然经常使用动态绑定样式的方法,但有时候突然要用,一瞬间还是会有点困惑,决定记录一下,方便混乱的时候查阅。

2024-03-05 11:23:29 340

原创 JavaScript异步编程

回调地狱手写Promise细数异步场景与处理策略从Promise到tj/co从callback到promiseasync与await用法与原理详解详解Promise A+规范

2024-02-26 20:59:56 708

原创 JavaScript事件机制

事件绑定事件处理常见问题与方案详解事件冒泡与事件捕获事件回调机制事件委托原理与实现

2024-02-26 14:09:41 900

原创 JavaScript原型继承与面向对象编程思想

原型继承与面向对象编程思想JavaScript 原型与原型链JavaScript 原型实现继承(原型继承、构造函数继承、组合继承)JavaScript new创建对象原理详解在JavaScript中,原型(prototype)、构造函数(constructor)和实例对象(instance)是面向对象编程中的重要概念,并且它们之间存在着紧密的关系。原型链是由对象的原型构成的链状结构。当试图访问对象的属性或方法时,如果对象本身没有定义,JavaScript引擎就会沿着原型链向上查找,直到找到相应的属

2024-02-23 15:13:43 1068

原创 this、闭包与作用域

this、闭包与作用域this指针详解默认绑定、显式绑定、隐式绑定闭包的概念存储空间、执行上下文闭包的使用场景 闭包就是有权访问另一个函数作用域中的变量的函数,创建闭包的最常见的方式就是在一个函数内创建另一个函数,并将函数返回。 执行上下文是JavaScript引擎在执行代码时创建的一个环境,它定义了变量和函数的可访问性。每当JavaScript引擎开始执行一段代码(全局代码、函数代码或eval代码)时,它都会创建一个新的执行上下文,并将其推入执行上下文栈。

2024-02-23 15:11:31 658

原创 Vue CLI学习笔记

Vue CLI是Vue.js的官方命令行工具,它是一个基于Vue.js进行快速开发的完整系统。通过Vue CLI,开发者可以快速搭建和开发Vue.js项目,提供了一整套完整的项目脚手架,包括项目初始化、开发服务器、构建工具等。是一个交互式的项目脚手架,通过简单的命令行界面,开发者可以快速创建一个新的Vue.js项目,并且会自动配置好项目的基本结构和依赖,让开发者可以直接开始编写代码。

2024-02-07 19:37:36 1147

原创 ES6学习笔记

ECMAScript 6 入门 - 《阮一峰 ECMAScript 6 (ES6) 标准入门教程 第三版》 - 书栈网 · BookStackECMAScript 6 入门目录其他 《ECMAScript 6入门》是一本开源的 JavaScript 语言教程,全面介绍 ECMAScript 6 新增的语法特性。https://www.bookstack.cn/read/es6-3rd/sidebar.md Babel 是一个广泛使用的 ES6 转码器,可以将 ES6 代码转为 ES5 代码,从

2024-02-01 14:09:21 1088

原创 webpack面试题学习

说说你对webpack的理解?解决了什么问题?说说webpack的构建流程?说说webpack中常见的Loader?解决了什么问题?说说webpack中常见的Plugin?解决了什么问题?说说Loader和Plugin的区别?编写Loader,Plugin的思路?说说webpack的热更新是如何做到的?原理是什么?说说webpack proxy工作原理?为什么能解决跨域?说说如何借助webpack来优化前端性能?如何提高webpack的构建速度?与webpack类似的工具还有哪些?区别?

2024-01-18 11:34:42 471 1

原创 webpack执行流程知识点总结

假设你有一个 webpack.config.js 文件,其中定义了一些 webpack 配置选项,还有一些 shell 脚本参数,你想将它们整合到一个 options 对象中,然后将这个对象传递给下一个流程。

2024-01-11 18:54:36 1198 1

原创 webpack学习笔记

之后,Webpack会将所有编译完成的模块按照它们之间的依赖关系组合成一个单独的文件,这个文件就是我们所说的“bundle”,最后将bundle文件发布到网站上,完成打包处理。resolve.modules 的默认值是 ['node_modules'],含义是先去当前目录下的 ./node_modules 目录下去找想找的模块,如果没找到就去上一级目录 ../node_modules 中找,再没有就去 ../../node_modules 中找,以此类推,这和 Node.js 的模块寻找机制很相似。

2024-01-10 10:38:18 1336

原创 webpack知识点总结(高级应用篇)

可以从以下角度来进行优化:1、提升开发体验使用Source Map让开发或上线时代码报错能有更加准确的错误提示。2、提升 webpack 提升打包构建速度使用HotModuleReplacement让开发时只重新编译打包更新变化了的代码,不变的代码使用缓存,从而使更新速度更快。使用OneOf让资源文件一旦被某个 loader 处理了,就不会继续遍历了,打包速度更快。使用Include/Exclude排除或只检测某些文件,处理的文件更少,速度更快。使用Cache对 es

2024-01-03 17:24:54 1304

原创 Vue中用watch一次监听两个值的变化

在Vue中,watch 本身不能监听多个变量。但我们可以通过返回具有计算属性的对象然后监听该对象,从而实现一次性“监听多个变量”。这样,我们就实现了再watch中一次性监听两个值的变化。想要一次性监听更多个值也可以这么操作。

2024-01-03 10:35:54 1931 2

原创 Vue项目优化-组件配置化、插件使用

Vue中可以根据需要去加载插件,一些自己写的插件在多个项目中都是需要用到的,通过把它们插件化,可以实现在需要用到的项目中便捷地复用,实现热拔插。

2023-12-29 11:25:23 391

原创 踩了Vue2运行机制的坑-响应式原理

在定义data/computed的时候,就先对A的所有属性进行枚举,需要用到后端data里的哪一层就枚举几层,于是就没问题了!

2023-12-29 10:25:14 1214

原创 webpack知识点总结(基础应用篇)

Webpack 是一个前端资源加载/打包工具。它将根据模块的依赖关系进行静态分析,然后将这些模块按照指定的规则生成对应的静态资源。Webpack是一个模块打包器。在Webpack中会将前端的所有资源文件(js/json/css/img/less/...)都作为模块处理。它将根据模块的依赖关系进行分析,生成对应的资源实际上, webpack-cli 给我们提供了丰富的终端命令行指令,可以通过npx webpack --help 查看帮助信息。

2023-12-19 18:37:10 1161

原创 vue中用v-html根据后端返回结果设置样式

一、问题一、问题1=====》今日遇到一个需求,是一个表格列返回状态status,并拥有多种不同颜色。2=====》平日里见到的基本都是返回01234......前端用插槽放进去,根据数字去判断显示字段以及设置不同样式,今天看到的是后端直接返回一个字符串,像这样:3=====》因此这一次我们不再需要根据字段去判断,而是直接写样式就行。=====》于是乎,我用了v-html把它放了进去,并直接在style下面写class相应的样式。

2023-12-18 14:51:34 865 5

原创 Vue组件封装基础知识

将兄弟组件需要共享的数据存储在vuex中,通过dispatch一个action来改变这个状态的值,并通过getter获取这个状态的值,从而实现兄弟组件之间的通信。通过共同的父组件来传递数据:如果两个组件拥有一个共同的父组件,那么可以在父组件中定义一个数据,并使用props将数据传递给这两个子组件。额外的,每次父级组件发生变更时,子组件中所有的 prop 都将会刷新为最新的值。4.组件的封装要考虑文档和测试,要提供清晰的文档说明组件的功能和使用方法,并且进行充分的测试,确保组件的质量和稳定性。

2023-12-14 16:35:02 1348 1

原创 Vue自动生成二维码并可下载二维码

遇到一个需求,需要前端自行生成用户的个人名片分享二维码,并提供二维码下载功能。在网上找到很多解决方案,最终吭哧吭哧做完了,把它整理记录一下,方便后续学习使用!嘿嘿O(∩_∩)O~首先,先记录一下我的实验版本,因为怕把项目搞砸,所以我就自己create一个单独的小demo来实验,等功能实现了再搬过去用。系不系很机智!!!在这里,二维码的大小是自适应的。

2023-09-13 12:31:09 810 7

原创 HTML5、CSS3、ES6新特性总结

HTML5 提供了一些新的表单输入类型和属性(例如日期选择、邮箱验证、自动完成等),以及表单验证 API,使得表单操作更加方便和强大,表单输入更加简洁和语义化。CSS3 引入了过渡(transition)和动画(animation)效果,使得在没有使用 JavaScript 的情况下,可以实现页面元素的平滑过渡和动态效果。

2023-09-13 11:40:22 459

原创 Ajax基础笔记

它支持局部更新,只更新需要改变的部分,而无需重新加载整个页面,提高了性能和效率。它使得网页能够在不重新加载整个页面的情况下与服务器进行数据交换,实现了网页的动态更新,提升了用户体验。需要注意的是,虽然Ajax提供了更好的用户体验和性能优势,但滥用Ajax可能导致过度使用服务器资源,影响网站的整体性能。因此,在使用Ajax时要注意安全性,采用安全措施,如验证输入和输出数据、使用HTTPS加密协议等。由于部分更新,减少了对服务器的请求次数,降低了带宽的消耗,提高了网页的性能。

2023-09-12 14:09:24 486

原创 前端设计模式基础笔记

策略类封装了具体的算法,上下文类负责调用策略类的算法,客户端类负责创建上下文类并设置具体的策略类。在MVVM模式中,视图(View)负责展示数据和接收用户操作,模型(Model)表示应用程序的数据和业务逻辑,ViewModel则处理视图和模型之间的交互。定义了一种一对多的依赖关系,让多个观察者对象同时监听某一个主题对象,当一个对象的状态发生改变时,所有依赖于它的对象都会被通知并自动更新。在前端开发中,可以使用观察者模式来实现事件的监听和响应,当某个事件触发时,通知所有注册的观察者进行相应的处理。

2023-09-12 11:59:59 367

原创 canvas基础笔记

通过 CSS 也可以定义 canvas 的尺寸,但此元素尺寸非彼画布尺寸,在绘制时图像会伸缩以适应它的画布尺寸;上面的代码创建了一个宽度为500像素,高度为300像素的Canvas元素,并指定了一个id为"myCanvas"。Canvas 是一个强大的绘图工具,可以实现各种图形、动画和图像的绘制。使用Canvas的上下文对象,可以绘制各种形状,如矩形、圆形、线条等。这些方法接受不同的参数,如坐标、尺寸、颜色等,可以根据需求进行调整。可以在每次绘制之前,先清空画布,然后再进行绘制,实现动态的效果。

2023-09-10 23:11:17 292

原创 小程序基础笔记

注意:sitemap 的索引提示是默认开启的,如需要关闭 sitemap 的索引提示,可在小程序项目配置文件 project.config.json 的 setting 中配置字段 checkSiteMap 为 false。安卓版的微信 App 是不能在 iOS 环境下运行的,所以,Android 是安卓软件的宿主环境,脱离了宿主环境的软件是没有任何意义的!分包预下载指的是:在进入小程序的某个页面时,由框架自动预下载可能需要的分包,从而提升进入后续分包页面时的启动速度。

2023-07-31 21:45:40 178 1

原创 前端常用的条件限制方法小笔记

【代码】前端常用的条件限制方法小笔记。

2023-07-28 14:17:12 1349

原创 商品库存管理系统设计与实现(Vue+SpringBoot+MySQL)

当今,我国科技发展日新月异,各类企业迅速崛起,商品类型日益繁多,产品数量急剧增加,企业经营模式越来越多样,信息处理量不断加大,对库存管理提出了更高的要求。通过本系统,能够打通供应商和零售商之间的货物信息流转,解决目前存在的信息孤岛现象。致力于在降低库存总量的同时保证最低安全库存,提高库存周转率,有效提升企业的库存管理水平。因此,打造一套能贯穿商品各活动流程,具备预警功能且符合企业需求的库存管理系统具有现实意义。

2023-07-24 14:28:09 1667

原创 Linux基础笔记

已经有很长很长时间一段没有更新帖子了,一眨眼2023 已经过半,因为太多事情要做了,今年只更新了几篇,这几天刚好有空,浅浅更新一篇叭!示例: cat a.txt | grep itheima,将cat a.txt的结果,作为grep命令的输入, 用来过滤itheima关键字。参数,关键字,必填,表示过滤的关键字,带有空格或其它特殊符号,建议使 用””将关键字包围起来。~,表示用户的HOME目录,比如cd ~,即可切回用户HOME目录。参数,文件路径,必填,表示要过滤内容的文件路径,可作为内容输入端口。

2023-07-03 19:23:16 216 3

原创 Vue3动态显示隐藏组件

Vue2用v-if或者v-show就直接完事了,可是vue3却没反应,需要设置强制重新渲染。

2023-03-17 16:29:47 2290 6

原创 用大白话解释基本的排序算法

先把每一个元素都看成一个只含有自身的有序队,然后两两归并成为一个有序队,没有归并对象就继续自成一队,然后再将各个有序队接着两两归并变成有序队,直到最后变成一个有序队。先从数列中取出一个数作为基准数,将比这个数大的数全放到它的右边,小于或等于它的数全放到它的左边,再对左右区间重复此操作,直到各区间只有一个数。从第一个数开始,后面的数与前面已有的数进行比较,找到合适的位置插进去,使前面的数据有序。每一轮操作都选择一个不同的间隔,对距离相同间隔的数据进行一一比较,后面比前面大则换位。

2023-03-14 15:18:33 126

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除