- 博客(18)
- 收藏
- 关注
RSS订阅原创 Vue2 的响应式原理
当我们通过数组的方法区更改数组时，或者直接删除 data 数据，数据并不能实现响应式，因为 Object.defineProperty 是没有办法处理属性的删除和新增的，因此 Vue2 的响应式通过数组方法(pop,push)或者是删除，vue 是不能监听的，Vue2 中可以通过 vue.datele 和 vue.set 这些 vue 内置 api 来改变属性，实现响应式。或者使用 this.$nextTick()方法等。
2024-03-22 17:06:41
187
1
原创 【无标题】Vue首屏加载过慢出现白屏的六种优化方案
webpack打包时借助 compression webpack plugin实现gzip压缩，安装插件如下：npm i -D compression-webpack-plugin。html、js、css文件甚至json数据都可以用它压缩，可以减小60%以上的体积。和组件懒加载：const One = ()=>import("./one");使用插件：prerender-spa-plugin。图片懒加载：使用vue-lazyload插件。修改vue.config.js。nginx开启gzip。
2024-03-22 17:03:22
654
1
原创 Vue3和Vue2的区别
vue3移除了配置文件目录，config 和 build 文件夹，移除了 static 文件夹，新增 public 文件夹，并且 index.html 移动到 public 中，在 src 文件夹中新增了 views 文件夹，用于分类视图组件和公共组件。（一）针对对象：针对整个对象，而不是对象的某个属性，所以也就不需要对 keys 进行遍历。（二）支持数组：Proxy 不需要对数组的方法进行重载，省去了众多 hack，减少代码量等于减少了维护成本，而且标准的就是最好的。（二）必须遍历对象的每个属性。
2023-12-27 17:23:54
1120
1
原创 Vue2和Vue3的自定义指令区别
Vue2中钩子函数：bind: 只调用一次，指令第一次绑定到元素时调用。在这里可以进行一次性的初始化设置。inserted: 被绑定元素插入父节点时调用。update：所用组件的VNode更新时调用，但是可能发生在其子 VNode 更新之前。componentUpdated：指令所在组件的 VNode 及其子 VNode 全部更新后调用。unbind：只调用一次，指令与元素解绑时调用。
2023-12-27 17:21:24
397
1
原创 H5调用微信支付
然后再调用微信官方支付API之前先调用后端接口,获取支付API所需要的参数,然后使用 window.wx.config去配置支付API,然后再去调用微信支付官方JDK,具体看下面代码即可。
2023-12-27 17:16:01
570
1
原创 uniapp中配置网络请求(非uniapp自带)
由于小程序不支持 axios ，并且原生的 wx.request() API 功能比较简单，且不支持拦截器等全局定制的功能；
2023-12-27 17:13:50
617
1
原创 前端在uniapp中将图片上传到阿里云服务器
关于阿里云的配置就不说了（后台会配置好并在接口中返回给前端相关配置信息）其中先从后端获取到阿里云配置的所有信息,一同返给后端。正常来说获取到上传图片信息,调用封装方法。但是如果是说多张图片的话,使用遍历即可。封装方法,只不过这里是单张上传逻辑。
2023-12-27 17:10:01
649
1
原创 vue可视化大屏及城市地图渲染
但是针对一些 echarts 图表相关的，antufit.js 也并不能完全 OK,所以要搭配这 echarts 提供的 resize 事件，在页面尺寸发生变化时触发。首先第一步使用 autofit.js 插件；这个插件使用之后，页面会根据浏览器的缩放自适应的改变宽高。如果要在整个项目做自适应,将配置配到App.vue,如果只要单个页面自适应,只需要配置当前页面即可。App.vue配置如下(单个页面自适应也是如此配置)这里就截个图，代码太多。
2023-12-27 17:07:58
1118
2
原创 Vue2组件传参大总结
简单来说,Vuex在大型项目中做数据统一管理的,在vuex中存储的数据,每一个组件都可以引用,vuex中的数据发生变化,引用该数据的组件会自动更新。最常见的父子组件通信方式,props支持参数验证,emit只会触发父组件的监听事件,不适合多层次组件参数传递,需要逐层传递参数。这是最基础的组件通信方式,父组件通过props可以向子组件进行通信,子组件通过emit向父组件通信。就是单纯的父组件给子组件传递参数,和子组件单纯的给父组件传递参数。4. 复杂组件不建议使用此方式传参,任意层级都能访问数据追踪困难。
2023-12-27 16:56:40
952
1
原创 Vue3实战项目拓展
其中要注意，接口返回状态为 401 时，表示需要登录，跳转登录后，需要回跳，则需要 router.currentRoute.value.fullPath 获取当前路由的完整路径作为他的值 来回跳。2. 在创建pinia实例化对象的地方引入该插件，例如mian.js。在components/CpIcon.vue。
2023-12-27 16:38:46
335
1
原创 Vue移动端仿APP左右滑动前进后退效果
本文实现这个效果的原理很简单。即：在各个页面定义层级，在切换路由判断用户是进入哪一层页面，如果用户进入更高层的页面那么就做前进动画，反之做后退动画。进入App.vue文件，监控路由跳转，判断切换页面之间层级关系，以此来判断路由前进或者后退.很多APP的前进和后退都是有效果的。例如前进是左滑，后退是右滑。1. 首先进行路由配置。3. 编写滑动类动画。
2023-12-27 16:32:15
505
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人