- 博客(18)
- 收藏
- 关注
RSS订阅原创 Vue3——认识Vue3
在setup()函数中手动暴露大量的状态和方法非常繁琐。我们可以将组件逻辑代码拆分成多个逻辑块，并以声明式的方式来管理组件的数据、计算属性、方法和生命周期钩子。当使用单文件组件时，我们可以使用来大幅度地简化代码。在script的开始标签中添加setup的字样。即可当我们使用<scriptsetup>时，所有变量和函数都会被自动注入到组件的模板中，不在需要显式地将它们绑定到模板上。这让代码更加清晰和简洁，并且减少了代码的冗余。
2025-01-07 18:46:23
844
原创 谈一谈对事件循环的理解
事件循环是JavaScript和Node.js中处理异步操作的核心机制。理解事件循环的工作原理对于编写高效、响应迅速的代码至关重要。通过合理利用事件循环，可以有效地管理异步操作，从而提高程序的性能和用户体验。
2025-01-06 19:35:11
1615
原创 前端开发中页面优化的方法
图片优化：使用合适的图片压缩工具，减小图片文件的大小，保持图片质量的同时提高加载速度。减少重绘和重排：在修改DOM元素样式时，避免频繁的重绘和重排操作，可以使用CSS3的transform和opacity属性代替传统的DOM操作。懒加载：延迟加载页面上的图片、视频和其他非关键资源，当用户滚动页面的时候再进行加载，减少初始加载时间。以上是一些常见的前端页面优化方法，根据我们具体的项目需求和问题，来选择适合的优化策略来提升页面性能。
2025-01-06 19:01:05
339
原创 Vue2中父子组件生命周期的执行顺序
生命周期阶段父子组件执行顺序加载渲染父beforeCreate → 父created → 父beforeMount → 子beforeCreate → 子created → 子beforeMount → 子mounted → 父mounted更新过程父beforeUpdate → 子beforeUpdate → 子updated → 父updated销毁过程父beforeDestroy → 子beforeDestroy → 子destroyed → 父destroyed说明。
2025-01-03 15:47:47
962
原创 Vue中状态管理--Vuex
其中参数state参数是必须的，也可以自己传递一个参数，如下代码，进行计数器的加减操作，加法操作时可以根据所传递参数大小进行相加，减法操作没有传参每次减一。
2024-12-30 18:57:49
1694
原创 Vue-插槽
插槽的作用：可以让组件内部的结构 支持自定义 看步骤： 上面是在被封装的组件中的代码下面是我们在App.vue中使用上面封装的组件 如果我们的slot标签中没有传递内容则 我们使用的slot的时候会出现一段空白区域 此时我们就需要给slot标签赋予默认内容。 直接看我的代码 此时我们使用slot标签的时候 如果不传递内容 则会显示slot标签的内容 既然是默认值，只有在我们没有给组件标签传值的时候才会使用 如果我们给 组件标签传入值的话 还是会优先使用组件标签的值
2024-12-27 18:00:22
444
原创 Vue-声明式导航跳转传参
当我们听到导航跳转传参时我们应该马上联想到我们的路由也就是router我们的跳转传参有两种语法:1.查询参数传参2.动态路由传参 都是在跳转路由时传递参数。
2024-12-27 16:16:40
633
原创 Vue中获取Dom元素--ref和$refs
作用:利用ref和$refs可以获取到组件实例或者dom元素特点:查找范围 → 当前组件内 更为精确稳定。
2024-12-27 15:09:32
1613
原创 Vue中的组件通信——props / $emit
给子组件标签 以添加 动态属性 的方式传值，我这里使用的是:title="我们父组件的数据名"我们的子组件使用props接收数据子组件的页面模板中 渲染使用父组件传递的数据。
2024-12-26 19:33:27
693
原创 Vue中自定义指令和键盘修饰符
我们在main.js中使用Vue.directive('指令名称',对象)指令的名称我们可以随便起 例如我们这里使用color 第二个参数是个对象这个对象有三个方法 分别是bind，inserted和update其中：bind 只调用一次，指令第一次绑定到元素时调用。在这里可以进行一次性的初始化设置inserted 这个元素已经渲染到界面上之后执行update 当元素有更新的时候执行那么我们这三个方法都有哪些参数呢？el：指令所绑定的元素，可以用来直接操作 DOM。
2024-12-19 21:06:32
659
原创 Vue的生命周期和过滤器
Vue 的过滤器是一种用于格式化文本的工具，通常在模板中使用。它们可以帮助你对数据进行处理和转换，以便在视图中以更友好的方式展示。在这个知识点中 有个新的符号 小伙伴们可能见过 | 这个符号 在这里我们叫管道符| 管道符Vue.filter('过滤器名字',回调函数（data:管道符前面的内容或者上一个过滤器的返回的内容，format())})上面是代码示例，下面是我们数据data() {return {msg: '我TMD你'},我们在模版中使用<div>过滤器{{ msg }}
2024-12-19 20:40:10
679
原创 JavaScript中数组的方法梳理
一个是ES5 另一个是ES6，虽然现在已经到ES N个版本了 但是现在统一ES5以后的都叫ES6。以上就是我认为常用的数组方法，我还有特别标注的，更要牢记啦，希望这个干活能够帮到你。所以我帮各位小伙伴梳理一下,我们这里先说一下数组的方法 我们知道 我们的JS有两个版本的。我知道很多小伙伴学习我们原生JS的方法的时候很懵，比方说数组的方法，字符串的方法等等。
2024-12-19 19:42:27
701
原创 Vue初始-第二天
我这里拿监听按下回车键做示例@keyup.enter → 监听键盘回车事件按下回车的时候打印输入框的值methods: {// 我们这里的方法 第一个参数通常都是事件对象efn(e) {// 当我们按下回车键的时候可以看到里面的key的值是Enter// 所以当我们加了.enter之后 就好比外层给我们做了一些判断console.log('键盘回车的时候触发 其他时候不触发', this.username);
2024-12-17 20:36:40
828
原创 Vue——JavaScript渐进式框架(初始)
框架假如上面的就是我们从后台获取过来的数据(一般放在数组当中，方便处理)，作为前端人员的我们肯定能够想象到出现的效果是什么样子的，但是用户肯定不知道啊对吧，这就是我们的任务这就是我们出现的效果渐进式:：我们单独看字面意思就是渐渐的进入，或者循序渐进。Vue相关的生态语法还是蛮多的，比方说：声明式渲染，组件系统客户端路由大规模状态管理和构建工具等等。就好比作为初学者的我们学习Vue就是要循序渐进的，学一点用一点。
2024-12-14 20:01:25
719
原创 关于css预编译器的区别Less和Sass
Sass是一种扩展了CSS的样式表语言，它使得CSS的编写更加高效、灵活和可维护。Sass的主要目标是提高CSS的可重用性和可读性，特别是在大型项目中。Less 是一种动态样式表语言，扩展了 CSS 的功能，旨在使样式表的编写更加灵活和高效。它通过引入变量、嵌套规则、混合宏（mixins）、运算和函数等特性，帮助开发者更好地组织和管理样式代码。Less 是一个强大的工具，适合希望提高 CSS 开发效率的前端开发者通过使用 Less，开发者可以编写更简洁、可维护的样式代码，从而提升整体开发体。
2024-12-12 18:49:25
770
原创 JavaScript- Bootstrap介绍
响应式与自适应的原理是相似的，都是检测设备，根据不同的设备采用不同的css，而且css都是采用的百分比的，而不是固定的宽度，不同点是响应式的模板在不同的设备上看上去是不一样的，会随着设备的改变而改变展示样式，而自适应不会，所有的设备看起来都是一套的模板，不过是长度或者图片变小了，不会根据设备采用不同的展示样式，流式就是采用了一些设置，当宽度大于多少时怎么展示，小于多少时怎么展示，而且展示的方式向水流一样，一部分一部分的加载，静态的就是采用固定宽度的了。
2024-12-11 20:01:55
925
原创 JavaScritp中变量声明的区别
let使用var时要注意作用域和提升，适合在函数作用域中使用。(一般面试中会考预解析)let和const提供了更严格的作用域控制，推荐在现代JavaScript中使用。let适合需要重新赋值的变量，而const适合不需要重新赋值的常量。
2024-12-11 19:36:38
746
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人