随笔分类 -  vue

vue中$nextTick原理分析
摘要：$nextTick 是 vue 中的异步更新，在官网是这样解释的：Vue 异步执行 DOM 更新。只要观察到数据变化，Vue 将开启一个队列，并缓冲在同一事件循环中发生的所有数据改变。如果同一个 watcher 被多次触发，只会被推入到队列中一次。这种在缓冲时去除重复数据对于避免不必要的计算和 DO 阅读全文
posted @ 2020-11-13 16:59 迷茫_D 阅读(696) 评论(0) 推荐(0)
Vue实现原理
摘要：简单的描述一下 Vue 2.x 的运行机制（需要注意分析的是 Runtime + Compiler 的 Vue.js）。 初始化流程： 创建 Vue 实例对象 init过程会初始化生命周期，初始化事件中心，初始化渲染、执行beforeCreate周期函数、初始化 data、props、compute 阅读全文
posted @ 2020-11-10 17:30 迷茫_D 阅读(495) 评论(0) 推荐(1)
vue3.0生命周期
摘要：vue 2.x的生命周期 beforeCreate created beforeMount mounted beforeUpdate updated beforeDestroy destroyed errorCaptured vue 3 setup (将2.x版本中beforeCreate和crea 阅读全文
posted @ 2020-10-10 16:37 迷茫_D 阅读(2099) 评论(0) 推荐(0)
基于vue二级表头显示及导出
摘要：最近做了一个关于表格的二级表头显示及导出功能，在此分享自己的经验... 一.安装element-ui并使用 npm install elemnt-ui -S// 在main.js文件中引入 import ElementUI from 'element-ui' import 'element-ui/l 阅读全文
posted @ 2020-07-22 14:32 迷茫_D 阅读(1982) 评论(0) 推荐(0)
Vue响应式原理（手写源码）
摘要：前言： 本文依照上一篇文章为基础进行书写，可先看上一篇开发环境的搭建后再来看本文章。链接：博客园 什么是响应式？ 简单的来说就是更改数据的时候，视图也会更新。 vue是利用了Object.defineProperty的方法里面的setter 与getter方法的观察者模式来实现。 1.vue响应式原 阅读全文
posted @ 2020-06-22 16:03 迷茫_D 阅读(533) 评论(0) 推荐(0)
Rollup开发环境的搭建（vue）
摘要：前言： webpack 是目前最为流行的前端构建工具。同时在前端工程化中，Webpack在开发/编译/构建中都起到了最关键的作用。所以在当下阶段，webpack的基本配置，是每一个前端程序员应当掌握的基本技能。 webpack 虽然非常火热，但后起之秀 rollup 却慢慢地蚕食着 webpack 阅读全文
posted @ 2020-06-17 11:34 迷茫_D 阅读(3723) 评论(0) 推荐(0)
vue中ueditor使用和上传图片和遇到的坑
摘要：最近使用了ueditor富文本做表单提交，其他动能使用正常，上传图片一直都有问题，找了很久最终解决了，分享一下我的经验. 一.下载ueditor Ueditor项目下载地址：http://ueditor.baidu.com/website/ 因为我使用的是vue，所以使用了这个插件vue-uedit 阅读全文
posted @ 2020-01-15 17:22 迷茫_D 阅读(10200) 评论(0) 推荐(0)
markdown的使用
摘要：markdown是什么？ Markdown是一种可以使用普通文本编辑器编写的标记语言，通过简单的标记语法，它可以使普通文本内容具有一定的格式。Markdown具有一系列衍生版本，用于扩展Markdown的功能（如表格、脚注、内嵌HTML等等），这些功能原初的Markdown尚不具备，它们能让Mark 阅读全文
posted @ 2019-12-24 21:10 迷茫_D 阅读(536) 评论(0) 推荐(0)
基于element-ui的日历显示当月考勤情况
摘要：前言：element-ui 日历组件calendar 自定义使用，做一个显示当月考勤情况的功能。 官方文档：https://element.eleme.cn/#/zh-CN/component/calendar 效果图： 准备工作： element-ui的版本最少是2.8.2，由于之前我安装的版本是 阅读全文
posted @ 2019-12-03 10:10 迷茫_D 阅读(12858) 评论(3) 推荐(2)
基于vue+element做图片的上传功能（二）
摘要：1.利用element中的upload的上传功能，由于项目需求只能上传传一张图片，所以就用了用户头像上传这个方法 详情看element网站：https://element.eleme.cn/2.0/#/zh-CN/component/upload 2.去网站上直接将代码拷贝下来，前提是element 阅读全文
posted @ 2019-11-28 16:46 迷茫_D 阅读(828) 评论(0) 推荐(0)
关于axios的封装
摘要：前言：在项目中与后台交互数据这块，通常用的是axios，Axios 是一个基于 promise 的 HTTP 库，可以用在浏览器和 node.js 中。vue是有自己请求数据的方式，vue-resource,把方法抽象出来后，总需要往方法里传 this.$http ,感觉是个超级不爽的设计，在vue 阅读全文
posted @ 2019-10-31 22:08 迷茫_D 阅读(631) 评论(0) 推荐(0)
laravel+vue项目优化加载
摘要：前言 最近做一个项目是php的laravel+vue的项目，刚开始还好，用的东西还不多也挺顺利的，遇到的问题也都解决了，随着项目功能的增多，项目的首页加载速度也越来越慢，打开控制台，app.js文件竟然加载了6、7s，这是一个非常不好的体验，下面就记录一下我的优化方法。 一.查看加载 一般项目结构都 阅读全文
posted @ 2019-08-07 09:28 迷茫_D 阅读(866) 评论(1) 推荐(0)
vue+element-ui做表格的导出功能（一）。
摘要：一.安装插件： 二.下载js文件，并用新建文件夹： 链接：https://pan.baidu.com/s/1wNyTHAc9RNNN1EB2Ta3Hfg 提取码：jbwa 复制这段内容后打开百度网盘手机App，操作更方便哦 在main.js文件夹引入： 更改Export2Excel.js文件，如下： 阅读全文
posted @ 2019-08-02 10:15 迷茫_D 阅读(6723) 评论(0) 推荐(0)
在vue中使用echarts
摘要：1.安装依赖： 1.安装依赖： 2.在.vue文件中引入： 3.开始使用，先创建一个简单的折线图，效果如下： 贴上代码： 在右侧添加工具栏： 给图标添加平均值和最大最小值，最后的代码是这样的： 效果是这样的： 4.按需引入，全局引入所有的echarts图表打包，导致体积过大。 在vue文件中引入： 阅读全文
posted @ 2019-07-30 16:42 迷茫_D 阅读(372) 评论(0) 推荐(0)
vue中使用baidu-map获取当前坐标。
摘要：1.安装iview $npm install iview --save 在main.js中引入 这样就算安装完成了！ 2.安装baidu-map插件 $ npm install baudu-map --save 安装成功之后就可以再页面上显示了，我做的是效果是这样的，一边移动一边获取点的坐标，点击也 阅读全文
posted @ 2019-07-05 20:51 迷茫_D 阅读(6649) 评论(0) 推荐(0)
vuex的理解。
摘要：1.什么是vuex？ 官方的解释：Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。 2.为什么需要用到状态管理？ 在开发中，我们经常会遇到多个组件试图依赖同一个状态，如果没有用到vuex，则需 阅读全文
posted @ 2019-07-02 22:00 迷茫_D 阅读(314) 评论(0) 推荐(0)
vue+element做图片的上传功能（一）
摘要：前几天做到一个关于图片上传功能，图片编辑和删除功能，和大家分享一下，写的不好欢迎大家吐槽！ 1.在vue的基础上安装element-ui，利用element中的upload的上传功能，我是使用这种照片墙的功能： 2.废话不多说，直接上代码： <el-upload class="upload-demo 阅读全文
posted @ 2019-06-26 14:51 迷茫_D 阅读(22419) 评论(0) 推荐(1)
vue项目使用websocket实现数据实时推送
摘要：写了一个关于工程的项目，关于工地数据的实时监控 1.后端要先写好数据，将数据传递给前端 2.在前端页面： $(function(){ var websocket = null; //判断当前浏览器是否支持WebSocket if ('WebSocket' in window) { websocket 阅读全文
posted @ 2019-05-16 17:04 迷茫_D 阅读(16517) 评论(0) 推荐(0)