关注
分享
全栈梦想家
记录所学知识，缩短和大神的差距！
展开
-
你未必能写出 CSS下拉导航栏
大家有没有遇到过这样的需求，在导航栏当中如果有子导航，我们鼠标经过时要展开，离开时要收起。相信你们第一反应会觉得这个功能非常简单，如果你这么认为的话那你先不要往下看代码，你自己实现一个试试看。原创 2024-04-29 11:41:35 · 464 阅读 · 2 评论 -
JavaScript常用循环方法介绍
JavaScript常用的循环方法原创 2023-03-25 17:38:20 · 138 阅读 · 0 评论 -
Ant Design Vue 修改Model弹框 样式不生效
于是研究了好久才找到样式不生效的原因。其他的样式都可以更改，唯独更改。弹框组件的样式一直不生效。组件库中又踩了一个坑。原创 2024-03-07 08:42:25 · 660 阅读 · 0 评论 -
你未必知道的CSS阴影
假设我们有这样的需求，给图片或元素周围设置阴影效果那么大家一定会联想到。这个属性能够根据周围的像素点来设置阴影，可以看到左边是需求效果，而右边使用了。解决这个问题的方法非常简单，可以通过。属性，但其实 实现的效果是不对的。后，效果并不是我们想要的那样。会给整个盒子设置阴影。原创 2024-03-07 08:35:16 · 484 阅读 · 0 评论 -
盘点 Vue 的生命周期每个阶段都做了哪些事儿
这个阶段还不能访问data中的属性以及method中的方法，因为Vue实例还没有初始化成功。此时Vue的实例已经挂载完毕，可以访问data和method了，一般在这里发起axios网络请求并赋值给data中的数据。但是还不能获取或修改dom元素，因为dom还没有挂载成功。如果情况特殊，可以使用nextTick来操作dom**beforeMount： ** 此时还是无法获取dom，因为dom还没有挂载到页面上。到这一步dom就挂载成功了，可以进行操作了。此时Vue。原创 2024-03-07 08:33:31 · 762 阅读 · 0 评论 -
JavaScript 函数柯里化的应用场景
函数柯里化就将一个多参数的函数转换为只能接收一个参数的函数。通过柯里化，可以将函数的参数逐步应用，形成一个参数序列，使得函数的调用更加灵活，方便参数的复用和定制。简单来说就是简化函数的参数接收，将多个参数尽可能的变少。原创 2024-03-07 08:32:51 · 467 阅读 · 0 评论 -
JavaScript 的类型转换机制
JS中的类型转换机制可以分为显式和隐式原创 2024-03-07 08:31:54 · 381 阅读 · 0 评论 -
最全 Vue 性能优化方案
当涉及到Vue应用的性能优化时，有许多技术和策略可以帮助提升应用的性能并改善用户体验。以下总结了常用的十种Vue的性能优化方案。原创 2024-03-07 08:30:22 · 4059 阅读 · 0 评论 -
带你快速上手 Nuxt3 服务端渲染
Nuxt.js 是一个基于 Vue.js 的服务端渲染框架，它提供了许多优势和功能。使用 Nuxt.js 可以帮助你构建高性能、可伸缩和易于开发的 Vue.js 应用程序，尤其适用于需要服务端渲染和优化的项目原创 2023-12-31 15:28:28 · 1315 阅读 · 0 评论 -
[建议收藏 持续更新] 前端开发 - 宝藏级网站汇总
[建议收藏 持续更新] 前端开发 - 宝藏级网站汇总原创 2023-12-31 15:26:45 · 1088 阅读 · 0 评论 -
[ Vue3 ] 三种方式实现组件数据双向绑定
在 Vue 中，组件数据双向绑定是一项非常重要的特性，它使得我们能够轻松地在组件中处理数据的变化并将其同步到视图比如我们想要在父组件中修改数据能够同步给子组件，并且子组件修改数据也能同步给父组件，使他们数据一方发生变化，则双方都发生改变原创 2023-11-28 17:31:03 · 9231 阅读 · 2 评论 -
微信小程序图片显示模式
image 是图片组件(注意,不是 img 哦, 是 image ), 用来展示图片的, 它也是通过 src 属性来指明图片的路径.image 组件默认宽度约 300px 、高度约 240px关于 image 组件, 还有一个属性叫做 mode , 它是用来控制图片的裁剪和缩放形式, 具体的可选值如下：mode值说明scaleToFill(默认值) 缩放模式，不保持纵横比缩放图片，使图片的宽高完全拉伸至填满image元素aspectFit缩放模式，保持纵横比原创 2022-04-14 15:58:22 · 2626 阅读 · 0 评论 -
带你一步步写出JS商城放大镜效果
html代码<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Demo</title> </head> <body> //结构 <di原创 2020-05-30 20:00:02 · 329 阅读 · 0 评论 -
JavaScript 扩展运算符实现数组解构、合并
使用扩展运算符可以轻松提取和操作数组元素。表示，可用于对象 或 数组的解构。原创 2023-09-08 11:30:38 · 102 阅读 · 0 评论 -
一篇文章搞懂instanceof方法
一篇文章搞懂instanceof方法instanceof的作用是判断对象的具体类型，返回的是一个布尔值。如果是指定类型返回 true，否则返回 false。 let obj = { name: '刘宇阳' } let arr = ['刘', '宇', '阳']; console.log(obj instanceof Object); //true console.log(arr instanceof Array); //true注意点数组本质上原创 2022-04-02 09:49:23 · 577 阅读 · 0 评论 -
一篇文章搞懂JavaScript解构赋值
JavaScript解构赋值首先我们需要了解一下为什么需要学习结构赋值先给大家对比一下传统写法与结构赋值写法定义多个变量数组解构赋值传统写法： let x = 10, y = 20, z = 30; //或者 let x = 10 let y = 20 let z = 30结构赋值的写法： let [x, y, z] = [10, 20, 30]; console.log(x) //10 consol原创 2022-04-01 15:22:20 · 2417 阅读 · 1 评论 -
JavaScript-DOM仿新浪注册页面案例
效果演示 undefined 代码实现<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">原创 2020-05-20 16:46:05 · 821 阅读 · 1 评论 -
[ 插件 ] 程序员必备的代码高亮插件 Highlight.JS
代码的样式直接的影响了阅读效果，一个好的代码高亮风格将会有好的体验。所以就需要用到代码高亮这款插件 Highlight.JS 来优化代码阅读的体验。原创 2022-08-14 21:52:43 · 4131 阅读 · 1 评论 -
[ JavaScript ] try catrh错误处理
有时候某一段程序出现错误就会导致后面的代码不再执行，直接让整个程序瘫痪。这并不是我们想要的结果，所以我们就需要用到错误处理。当某一段程序报错后不会影响后面的代码，后面的代码正常运行......原创 2022-08-14 21:54:07 · 251 阅读 · 0 评论 -
[ 前端开发 ] 为什么要学习ES6？
1. ES6 是 JavaScript 的下一个版本标准，诞生于2015年6月份。ES6 的主要目的是为了解决 ES5 的先天不足。2. ES6 的终极目标是为了使 `JavaScript` 语言可以用来编写复杂的大型应用程序，成为企业级开发语言。原创 2022-08-21 21:32:16 · 736 阅读 · 0 评论 -
[ 前端开发 ] ES6模板字符串
模板字符串是 `ES6` 的新特性，他的作用是减少了字符串的拼接操作，提高了程序的可读性原创 2022-08-22 18:16:38 · 375 阅读 · 0 评论 -
采用nodejs + socket.io实现简易聊天室功能（群聊 + 私聊）
采用nodejs + socket.io实现简易聊天室功能，支持群聊以及私聊原创 2023-09-08 11:49:51 · 536 阅读 · 2 评论 -
[ Nodejs ] MD5 | Bcrypt 数据加密
这篇文章分别讲解了MD5 与 Bcrypt这两种数据加密方式原创 2022-08-09 13:53:45 · 784 阅读 · 0 评论 -
[ CSS ] 使用定位实现元素垂直、水平居中
用定位实现元素垂直、水平居中实现方法效果图如果想要实现这种效果，使元素在浏览器水平、垂直居中，需要给定位top跟left值分别设置为50%<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport原创 2021-10-28 19:58:59 · 1071 阅读 · 0 评论 -
[ 前端开发 ] 文本溢出以省略号显示效果
代码】[ 前端开发 ] 文本溢出以省略号显示效果。原创 2022-08-14 21:57:33 · 222 阅读 · 0 评论 -
[前端开发] 行内/行内块元素默认的间隙原理其解决办法
原理：行内元素默认会有空格间隙，其原理就是因为标签换行所产生的解决的方案：1.如果我们将行内标签写在一行上，则不会出现间隙问题2.当然我们也可以使用浮动来清除间隙，因为浮动可以脱离标准流，所以自然不会出现间隙问题......原创 2021-10-28 19:55:40 · 1205 阅读 · 0 评论 -
[前端开发] CSS中 em 与 rem的区别
有很多小伙伴们不知道em与rem的区别，那么这篇文章一定能对你有所收获！原创 2022-08-07 11:28:28 · 388 阅读 · 0 评论 -
[ 前端开发 ] label标签的使用
标题label标签的使用label标签简单理解为可以绑定表单元素。label本身与某个表单绑定，当用户点击了label标签则会触发表单，也就相当于点击了表单，代码演示：给需要绑定的表单设置一个id，然后给label设置一个for，他们的值相匹配就可以实现绑定<label for="qwe">男</label> <input type="text" id="qwe">当然，他还有一种写法<label>男<input type="原创 2021-10-28 19:53:37 · 27646 阅读 · 0 评论 -
在项目中使用 vee-validat 表单校验组件
在项目中使用 vee-validate 表单校验组件原创 2023-08-30 11:39:37 · 212 阅读 · 0 评论 -
Vue 不是内部或外部命令解决办法
解决：Vue 不是内部或外部命令解决办法原创 2022-09-29 20:34:40 · 3852 阅读 · 5 评论 -
一篇文章教会你 Vue3 + Vite 项目资源如何动态访问
一篇文章教会你 Vue3 + Vite 项目资源如何动态访问原创 2023-09-08 15:28:15 · 1128 阅读 · 0 评论 -
[ Vue3 ] 组合式API + Setup语法糖 如何获取组件实例？
在Vue2中，我们可以给组件设置ref来获取组件实例中所有的属性和方法原创 2023-11-26 18:51:50 · 1735 阅读 · 0 评论 -
Vue3 数据双向绑定 / 原理
这样一来不论是父组件还是子组件修改了数据，数据都会同步发生变化。来实现组件之间的数据双向绑定，下面是一个简单的示列。如果需要实现多个数据双向绑定，可以这么写。方法来修改数据 实现双向绑定。在子组件中调用父组件的。原创 2023-06-26 19:52:47 · 1138 阅读 · 0 评论 -
没有一句废话 快速入门 Pinia，告别 Vuex
Pinia 是一个状态管理工具，它和 Vuex 一样，为 Vue 应用程序提供全局数据共享能力。通过这篇文章快速入门 Pinia🍍，告别 Vuex原创 2023-09-08 08:40:18 · 113 阅读 · 0 评论 -
[ CSS ] 文本禁止被选中、复制操作
通过这篇文章能你明白user-select: none的应用场景，以及使用！原创 2022-09-29 21:20:57 · 1003 阅读 · 0 评论 -
CSS 四中方法实现水平 垂直居中
CSS 四中方法实现水平 垂直居中原创 2023-09-08 15:55:32 · 148 阅读 · 0 评论 -
[ CSS ] 内容超出容器后 以...省略
padding;margin;color;;原创 2023-11-27 10:34:11 · 568 阅读 · 0 评论 -
[ BUG ] 踩坑 Axios Delete 请求传参
在 `POST` 请求中，我们可以直接将数据对象作为第二个参数传递给 `Axios`，因为 `POST` 请求通常包含请求体。但是在 `DELETE` 请求中，我们需要使用对象字面量套一个自定义的 `data` 作为第二个参数，并使用 `data` 字段指定数据。原创 2023-11-27 10:30:51 · 1044 阅读 · 0 评论 -
Vue3 + Scss 实现主题切换效果
先给大家看一下主题切换的效果：像这样的效果实现起来并不难，只是比较麻烦，目前我知道的有两种方式可以实现，分别是CSS变量、样式文件切换，下面是该效果的核心实现方法。原创 2023-11-27 10:29:56 · 1318 阅读 · 0 评论 -
[ TypeScript ] 多个不同文件但类型名相同该如何区分？
在使用TypeScript时，当遇到不同文件中存在相同名称的类型定义时，我们可以使用命名空间或模块来解决类型名称冲突的问题。通过将不同的类型定义封装在命名空间或模块中，并通过命名空间或模块来引用它们，我们可以避免类型冲突，并准确地使用每个类型定义。无论是命名空间还是模块，我们都应根据项目的需要和组织结构来选择使用合适的方式。命名空间适合用于更传统的代码库，而模块适合用于现代的模块化项目。根据不同的情况，选择合适的解决方案，将大大提升代码的可读性和可维护性。原创 2023-11-27 10:21:44 · 497 阅读 · 0 评论