m0_52872381的博客

原创 Vue 项目中的自适应布局：px 转换成 vw/vh

在移动设备上，不同分辨率的屏幕对应的界面大小不同，这就需要。

原创 Vue中使px自动转化为rem配置（h5适配问题）

PostCSS。

原创 grid布局的实现

【代码】grid布局的实现。

原创 如何用css实现模糊效果

【代码】如何用css实现模糊效果。

原创 打包上线不确定接口IP以及端口 如何处理

打包项目最后生成的文件夹如下图所示，这时候你就可以修改config.js里的配置，项目里的配置就会随之更改了。也不需要在重新打包了。

原创 当在浏览器中输入一个网址后，按下回车时，会触发一系列的过程

浏览器将解析后的HTML代码构建成DOM数，并将css样式应用到DOM数上生成渲染数。最后，根据渲染数计算没个元素的布局和位置，绘制到屏幕上，呈现出完整的网页。如果该域名已经在浏览器的存缓中，则直接使用缓存的ip地址，否则，浏览器会发起dns请求来获取ip地址。这个请求包含了请求方法（get post等）、请求的资源路径、http版本号以及其他一些有关请求头的信息。浏览器接受到服务器的响应后，开始解析HTML代码。同时，浏览器会并行地发起请求来获取页面中引用其他的资源（如css文件，js脚本、图片等）

原创 websocket 如何判断是否建立连接成功 10分钟没说话 如何判断连接是否断开

对于长时间没有数据传输的情况，可以通过设置心跳机制来检测连接是否仍然活跃。客户端和服务器可以定期发送心跳消息，例如每隔一段时间发送一个特定的消息，如果在一定时间内没有收到对方的回应，则认为连接已经断开。在创建 WebSocket 实例后，可以通过监听open事件来确定连接是否成功建立。当连接成功建立时，浏览器会触发open事件。可以监听close事件来判断连接是否意外断开。当连接被关闭时，无论是由于网络问题还是其他原因，都会触发close事件。

原创 在前端开发中，如何处理列表分页时遇到接口延迟或数据返回顺序不一致的问题

在每次请求时，保存当前请求的页码，并在数据返回时检查这个页码。只有当返回的数据页码与当前请求的页码一致时，才更新视图。在发送新的请求之前，可以取消之前的请求。使用像 Axios 的 CancelToken 可以帮助你做到这一点。在发送请求时，设置一个加载状态（例如 isLoading），告诉用户正在加载数据。当收到数据后，再更新状态。2. 取消上一个请求。3. 保持数据一致性。

原创 问题1：promise和async await的区别

Promise 使用.then()和.catch()处理异步操作，而 async/await 基于异步函数，用await等待异步操作完成，使异步代码更像同步代码。对于可读性和可维护性，Promise 在复杂异步组合时可能嵌套过多，代码难读难维护，而 async/await 更接近同步代码结构，提高了可读性和可维护性。在错误处理方面，Promise 通过.catch()捕获错误，async/await 用try/catch·块，更直观。

原创 在前端开发中，如何处理列表分页时遇到接口延迟或数据返回顺序不一致的问题

在每次请求时，保存当前请求的页码，并在数据返回时检查这个页码。只有当返回的数据页码与当前请求的页码一致时，才更新视图。在发送新的请求之前，可以取消之前的请求。使用像 Axios 的。），告诉用户正在加载数据。当收到数据后，再更新状态。在发送请求时，设置一个加载状态（例如。可以帮助你做到这一点。

原创 延迟加载js的方式

原创 undefined和null的区别

原创 uni-app的分包

2.小程序启动默认下载主包并启动页面，当用户进入分包时，才会下载对应的分包，下载完进行展示。1.分包有利于优化小程序的下载和启动速度。

原创 echarts常用组件

原创 SEO如何进行优化

2.预渲染：prerender-spa-plugin。

原创 nuxt.js的使用

是基于vue的应用框架，关注的是渲染，可以开发服务端渲染的应用配置。好处：SSR生成的是有内容的html页面，有利于搜索引擎的搜索。SPA的应用不利于搜索引擎SEO的操作。SEO：优化搜索引擎。

原创 首屏优化该如何去做

5.减少首屏上js、css等资源文件的大小。7.尽量减少dom的数量和层级。3.首屏不重要的组件延迟加载。4.静态资源放在cdn上。9.做一些loading。2.非首屏组件延迟加载。10.开启Gzip压缩。

原创 动态路由的使用

原创 路由导航守卫有哪些？

原创 vue的两种路由传值

接收：this.$routes.params.a。接收：this.$routes.query.a。传值：this.$router.push({传值：this.$router.push({2.隐式传值：在路径上看不到所传递的值。1.显式传值:可以在路径上看到。

原创 项目打包以后出现空白页怎么解决

2.开发环境要用hash模式进行测试，上线要改成history模式，要让后端进行重定向。1.如果是路径问题，要在vue.config.js中对publicpath进行配置。

原创 vuex的使用

持久化处理：npm run vuex-persist。

原创 props与data的优先级

原创 兄弟组件之间传值

原创 css样式

原创 keep-alive的应用场景

原创 vue2与vue3的区别

2.vue2中存在数据更新以后视频不更新的问题，故存在$set来解决这一问题，而vue3中数据双向绑定不存在数据更新视图不更新的问题，所以也就没有this.$set。1.v-if与v-for的优先级不同。

原创 什么是渐进式框架

vue.js 是基础，在此基础上可以添加各插件不断完善，例如vue-router、vuex、element。

原创 vue3中teleport传送门的使用

原创 vue3中如何拿到vue2中的this

vue3中常用api。

原创 vue中单向绑定

单向绑定其实就是父传子。

原创 如何自定义指令

1.全局注册：main.js。

原创 methods与computed的区别

computed有缓存机制，只要值没有发生改变，都会优先从缓存中拿取，methods没有缓存机制，调用几次就执行几次。

原创 computed计算属性与watch侦听器

1.computed计算属性的写法有两种，一种是只读的，只负责展示，另一种可以进行修改，利用get来获取值，利用set来进行修改。2.watch侦听器的写法也有两种，可以直接写成函数，也可以写成对象，写成对象可以进行深度监听也可以立即监听。

原创 data中return内外定义数据的区别

原创 解决复杂类型中数据更新，视图不更新的问题

原创 导航守卫的分类

全局守卫一般用于登录鉴权。

原创 vuex+vuex-persistedstate实现数据持久化处理全局通信

【代码】vuex+vuex-persistedstate实现数据持久化处理全局通信。

原创 vue3+ts

vue3+组合式API、 Vite构建工具、 TypeScript 、vue-router 、Pinia状态管理、 element-plus、 axios网络交互，echarts。ref：父组件获取子组件实力VC，获取子组件的响应式数据以及方法。slot：插槽（默认插槽，具名插槽，作用域插槽）实现父子组件通信。props:实现父子组件，子父组件，甚至兄弟组件通信。vuex：集中式状态管理容器，实现任意组件通信。3.svg矢量图在项目中集成应用。自定义事件：可以实现子父组件通信。1.菜单权限与按钮权限开发。

原创 解决使用css变量报错问题

【代码】解决使用css变量报错问题。