- 博客(22)
- 收藏
- 关注
RSS订阅原创 vue3 api使用（watch函数、生命周期函数、组件通信）
子组件中通过 defineProps编译宏进行编译接收。并直接在页面中使用。defineProps编译宏会将setup和当前props进行抽离，抽离出一个props对象。2.子组件中需要暴露组件的属性和方法，才能在ref模板中获取到组件实例的属性和方法defineExpose。深度监听：deep:true(watch()内添加第三个参数，以对象的形式，添加deep属性。1.vue3中获取dom组件实例对象可以在onMounted生命周期函数中获取。概念：通过ref标识获取真实的dom对象或者组件实例对象。
2024-06-08 18:11:42
289
原创 vue3中导入子组件报错
项目报错：父子组件通信中，导入子组件报错提示：Internal server error: Failed to resolve import "@components/son-com.vue" from "src/App.vue". Does the file exist?
2024-06-07 11:12:09
253
转载 promise 的用法
回调方法：就是将一个方法 func2 作为参数传入另一个方法 func1 中，当 func1 执行到某一步或者满足某种条件的时候才执行传入的参数 func2Promise 是 ES6 引入的异步编程的新解决方案。（可以实现回调方法同样的功能）Promise 对象三种状态：初始化、成功、失败 pending-进行中、resolved-已完成、rejected-已失败就好像，你跟你女朋友求婚，她跟你说她要考虑一下，明天才能给你答案，这就是承诺（promise）。
2024-05-23 10:25:03
19
原创 手写call&apply&bind
核心逻辑是：要改变当前this指向第一个参数obj，实际上是通过在obj对象中添加一个调用函数this. this在这里是函数的调用对像，比如:obj.fn,this就是obj.apply的特点是传入的剩余参数是一个数组对象。简单实现，后续更新.....
2024-05-23 08:49:50
163
转载 图片懒加载
链接：https://leetcode.cn/leetbook/read/interview-coding-frontend/dzv8fv/方法一：滚动监听 + scrollTop + offsetTop + innerHeight。innerHeight：当前浏览器窗口的大小。需要注意兼容性问题。scrollTop：指网页元素被滚动条卷去的部分。offsetTop：元素相对父元素的位置。来源：力扣（LeetCode）作者：LeetCode。
2024-05-22 22:29:29
45
转载 vue2和vue3的区别
一个逻辑会散乱在文件不同位置（data、props、computed、watch、生命周期函数等），导致代码的可读性变差，需要上下来回跳转文件位置。组件，允许程序在等待异步组件时渲染兜底的内容，如 loading ，使用户体验更平滑。除了增强了代码的可读性、内聚性，组合式API 还提供了较为完美的逻辑复用性方案，举个 ，如下所示公用鼠标坐标案例。为例子，在 Vue2 中，全局 API 暴露在 Vue 实例上，即使未使用，也无法通过。Vue2中，编写页面的时候，我们需要去将组件包裹在。拦截目标对象的行为。
2024-05-22 12:41:37
7
转载 从数组中找出某个值的元素
/2: find:find() 方法返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined。链接：https://leetcode.cn/leetbook/read/interview-coding-frontend/dq6zuv/// 第五章：从数组 [1,2,3,4,5,6] 中找出值为 2 的元素。商业转载请联系作者获得授权，非商业转载请注明出处。来源：力扣（LeetCode）作者：LeetCode。
2024-05-22 11:28:23
8
转载 for..in 和 for..of 用法
For...in用于遍历对象的属性名，而For...of用于遍历可迭代对象的值。在JavaScript中，For...in和For...of都是用于循环遍历数据结构的循环语句，但它们之间有一些重要的区别。For...in遍历对象的属性名，而For...of遍历可迭代对象的值。此外，For...in遍历的是对象的所有可枚举属性，包括它的原型链上的属性，而For...of只遍历可迭代对象中的值。最后，For...in返回的是属性名，是一个字符串，而For...of返回的是值，可以是任何类型的值。
2024-05-22 11:13:21
13
原创 防抖节流函数
节流的原理是在触发事件后设置计时器。在计时器延迟过程中，即使事件再次触发，计时器的延迟时间也不会改变。在计时器执行功能之前，计时器不会复位。链接：https://leetcode.cn/leetbook/read/interview-coding-frontend/dq3hqi/：是在触发事件后设置计时器。在计时器延迟过程中，如果事件再次触发，则重置计时器。在没有触发事件之前，计时器将再次触发并执行相应的功能。即使在这段时间管道里有更多的水，水龙头也不会掉更多的水。作者：LeetCode。
2024-05-22 10:58:25
131
转载 深拷贝&浅拷贝
2.浅拷贝:浅拷贝会创建一个对象，再去遍历对象的原始对象，如果拷贝的是基础类型，那么就拷贝基础类型的值，如果拷贝的是引用类型，那么拷贝的是地址，如果改变新的对象那么原来的对象也会被改变。浅拷贝的语法糖Object.assgin(新的对象，需要拷贝的对象)引用数据类型的特点：存储的是该对象在栈中引用，真实的数据存放在堆内存里，引用数据类型在栈中存储了指针，该指针指向堆中该实体的起始地址。1.对象赋值：将一个对象赋值给一个新的对象时，赋的其实是对象的地址，而不是数据，两者的改变会互相影响，
2024-05-22 09:51:54
6
原创 vant组件库使用
这里以按需自动引入为例，如果需要全局引入和手动引入，参考vant2官方文档使用说明。第二种调用方法是因为在导入注册vant组件的时候，相关组件方法会自动挂载到vue的原型上。2）移动端：vant-ui（常用：移动端掌握vant即可，其他缺少维护） mint ui cube ui(滴滴）1）pc端：element-ui(element-plus) ant-design-vue。vue的组件库并不是唯一的，vant-ui仅仅只是组件库的一种。方法1：导入调用（组件内或者非组件内都可以使用）
2024-05-18 22:30:00
411
原创 短信验证码倒计时
1.点击短信验证码，需要提交校验用户是否输入手机号码和图形验证码。2.校验通过开启倒计时，当时间走到0时复位。关闭定时器：离开页面时销毁定时器，提升性能。
2024-05-18 16:43:11
165
原创 1.寻找身高相近的小朋友（算法）
小明升学到了小学1年级来到新班级后，发现其他小朋友身高参差不齐，然后就基于各小朋友和自己的身高差，对他们进行排序。输出排序结果，各正整数以空格分割和小明身高差绝对值最小的小朋友排在前面和小明身高差绝对值最大的小朋友排在后面如果两个小朋友和小明身高差一样，则个子较小的小朋友排在前面。
2024-05-17 14:17:03
276
原创 vue Cli脚手架搭建项目
Vue Cli vue脚手架 是vue 官方提供的一个全局命令工具可以帮助我们快速创建一个开发的vue项目的标准化基础架子，集成了webpack配置，统一配置。
2024-05-17 14:08:32
233
原创 error:报错处理2（net::ERR_FAILED 404 (Not Found)
将封装的axios中的基地址修改为正确的基地址之后接口请求成功。前端配置跨域处理之后问题没有解决。场景：配置基地址请求接口时报错。
2024-05-17 10:39:54
306
原创 vue项目中封装api接口模块
在项目的src根目录下新建一个api文件，里面存放各个模块的接口请求。将请求封装成方法，统一存放到api模块，与页面分离。：在对应的功能模块中按需导入封装的方法并使用。在单独封装的login模块中发送登录相关请求。2.相同的请求可以直接复用。1.请求与页面逻辑分离。3.请求进行了统一管理。
2024-05-17 10:26:46
252
原创 vue项目中封装axios模块
使用axios来请求后端接口，一般都会对axios进行一些配置（比如：配置基础地址，请求响应拦截器等），所以项目开发中，都会对axios进行基本的二次封装，单独封装到一个request模块中，便于维护使用。2_新建request模块：（在项目中的utils文件夹中新建一个request.js文件，作为公共方法）优势：封装之后便于统一服务器资源请求。对不同的服务器资源可以封装不同的请求文件。4_测试使用（created生命周期钩子函数中发送接口请求）目标：将axios请求方法，封装到request模块。
2024-05-16 23:54:17
138
原创 报错1：搭建项目安装依赖报错
降级eslint-plugin-vue到@vue/eslint-config-standard支持的版本。安装命令加-legacy-peer-deps 进行安装。忽略冲突，强行安装。可以看到这里的报错和搭建项目时选择了eslint有关系。的 ^7.0.0 版本，但是项目中安装了更高版本的。报错信息：（安装vant组件库报错）降级之后再安装，就能成功。
2024-05-16 12:37:49
585
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人