![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Vue.js
文章平均质量分 73
欧阳呀
早一批“吃螃蟹”的人。多年前端开发及项目管理经验,擅长vue,原生js,react。v: ouyang_Allen,承接毕设
展开
-
element ui el-calendar日历组件完整代码
【代码】element ui el-calendar日历组件完整代码。原创 2024-05-30 14:55:35 · 689 阅读 · 3 评论 -
Vue实战技巧 —— 企业开发实战中的常见疑难问题
【代码】Vue实战技巧 —— 企业开发实战中的常见疑难问题。原创 2024-05-14 20:52:15 · 843 阅读 · 1 评论 -
vue前端上传图片到阿里云OSS,超详细上传图片与视频教程
vue前端上传图片到阿里云OSS,超详细教程,上传图片与上传视频都有提供案例原创 2023-12-23 11:50:11 · 5133 阅读 · 0 评论 -
Vue+element ui遇到的一些疑难问题总结(一)
Vue+element ui遇到的一些疑难问题总结:el-tree,el-cascader等等原创 2023-02-22 12:25:59 · 399 阅读 · 0 评论 -
猿创征文|Mock.js概述及模块化开发实践(一文足矣)
一文搞定Mock.js。缩短项目的研发周期,前端开发者可以不用等待后台接口再进行联调。原创 2022-09-01 12:20:34 · 5045 阅读 · 14 评论 -
如何成为团队核心?从写出不可维护的代码开始
如何成为团队核心?从写出不可维护的代码开始前端必备技巧Vue原创 2022-07-29 13:05:26 · 9530 阅读 · 21 评论 -
token系统讲解及过期处理
token详细讲解,是什么,用来做什么?如何解决token过期的问题?最好的方案分享原创 2022-07-25 14:11:50 · 14248 阅读 · 17 评论 -
element ui 上传图片
element ui图片上传,一看即会,小白专用原创 2022-03-28 21:06:19 · 7309 阅读 · 0 评论 -
element ui视频上传(已上线,拿去即用)
Vue+element ui 视频上传 + 进度条实现,已上线,拿去即用原创 2022-03-28 20:29:12 · 14619 阅读 · 13 评论 -
Vue底层原理之变化侦测 —— 让对象每一个属性都变得“可侦测”(一)
Vue底层原理之变化侦测1. 说在前面2. 使Object数据“可侦测”3. 让对象所有属性都变成“可观测”4.测试及使用1. 说在前面1.1 Vue的两大特性组件系统:把页面抽象成多个相对独立的模块,实现代码重用,提高开发效率和代码质量,便于代码维护。数据驱动:宗旨是以数据驱动,减少dom操作。数据可以理解为状态,视图即是用户所见页面,它是动态变化的,根据用户的操作或者后台数据变化来,状态变化视图(也就是页面)也会随之改变,所以我们得到了这样一个公式:state是状态输入,页面UI是原创 2022-01-10 18:30:48 · 15965 阅读 · 0 评论 -
Vue3.0+Vant ui配置按需引入(非vue-cli3.0)
Vue3.0+Vant ui配置按需引入 —— 架构搭建1. 说在前面2. Vant ui安装3. 配置按需引入4. 配置main.js(官网上说的估计小白看不懂)5. 页面中使用按需引入的组件1. 说在前面1.1 这是一件令我比较无语的事情最近使用 Vue3.0 + vant开发项目,官网上的配置,按需引入其实不太好理解于是想着“面向百度编程”,百度下看看,结果网上有很多人连Vue3.0和vue-cli3.0都分不清楚,找了半天都是vue-cli3.0的(有同感的可以评论区扣个1)我人都傻原创 2021-11-29 10:50:41 · 2358 阅读 · 0 评论 -
深入Vue底层,手写一个vuex
深入底层,手把手教你写一个Vuex1. Vuex是什么?什么场景下使用?2. Vuex的基本使用3. 手写一个vuex1. Vuex是什么?什么场景下使用?Vuex是vue的一个插件,叫做状态管理模式,全局共享某一些状态通俗来讲,当各组件需要共享某一组状态的时候,会用到Vuex,兄弟组件及跨级组件传值也可以派上用场(如果数据量不大,或者组件状态不需要共享也可以用中央信息插件event-bus)2. Vuex的基本使用vue-cli 4.0 以上,在搭建脚手架的时候选择此项就可以项目搭建完原创 2021-11-15 10:41:22 · 11553 阅读 · 10 评论 -
敲黑板,划重点!!!Vue3.0响应式实现原理 —— proxy()
Vue3.0响应式实现原理1. 先来回顾一下Vue2.0的响应式原理2. Vue3.0原理实现 —— Proxy()3. 重点说明 —— Reflect1. 先来回顾一下Vue2.0的响应式原理通过 Object.defineProperty() 实现数据劫持存在的问题针对对象:新增属性,删除属性,界面不更新针对数组:通过下标修改数组,界面不会自动更新<!DOCTYPE html><html> <head> <titl原创 2021-08-11 09:22:29 · 15928 阅读 · 2 评论 -
重磅知识,Vue3.0 生命周期(变化不止一点)
Vue3.0生命周期1. 与 2.x 版本生命周期相对应的组合式 API2. 新增的钩子函数1. 与 2.x 版本生命周期相对应的组合式 APIbeforeCreate -> 使用 setup()created -> 使用 setup()beforeMount -> onBeforeMountmounted -> onMountedbeforeUpdate -> onBeforeUpdateupdated -> onUpdatedbeforeDestr原创 2021-08-11 09:17:47 · 1103 阅读 · 14 评论 -
初探Vue3,几个常用的重要特性抢先看(建议收藏)
Vue3.0重磅来袭1. Vue3.0项目创建(脚手架方式)2. 拉开序幕 —— setup()3. 基本数据的响应式实现 —— ref()4. 引用数据的响应式实现 —— reactive()5. FAQ(需要注意的地方)1. Vue3.0项目创建(脚手架方式)## 安装或者升级npm install -g @vue/cli## 保证 vue cli 版本在 4.5.0 以上vue --version## 创建项目vue create my-project接下来按步骤走即可Plea原创 2021-08-09 11:34:43 · 17548 阅读 · 36 评论 -
超级实用的vue小技巧,用了之后直呼好棒~
实用的vue小技巧,来源于真实企业实战1. 原型注入2. 对象冻结3.img 加载失败4. 递归组件1. 原型注入全局属性和方法可以这么定义方便调用和获取一般不定义很多(会污染原型,每次实例Vue都会带上)// main.js入口文件内import Vue from "vue";import router from "./router";import store from "./store";import dayjs from "dayjs";import App from "./原创 2021-07-15 08:42:07 · 10479 阅读 · 50 评论 -
腾讯架构师带我写代码 —— vue真实企业实战分享
Vue.js+element ui构造后台管理系统阅读本文你会收获些什么?项目预览项目技术栈概览1. 路由配置2. 登录页配置3. API层配置(接口配置)4. 跨域处理5. 可以愉快的调接口了6. main.js中 你需要的配置7. 配置路由拦截8. 全局方法配置9. 父页面配置(home.vue)10. FAQ:你可能会碰到的问题及解决方案阅读本文你会收获些什么?不玩虚的,真实的企业项目实战技巧,可以直接拿过去用真实的接口调用,实现相关功能优秀的封装技巧(本项目在前腾讯前端架构师指导下构建)原创 2021-05-27 08:42:35 · 20825 阅读 · 169 评论 -
前端萌新看过来了—— 0基础1小时vue入门到实战
Vue.js+element ui从零开始一个项目项目概览1. 脚手架安装与搭建合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML 图表FLowchart流程图导出与导入导出导入项目概览Vue版本:V 2.6.element ui版本:V开发工具:vscode(推荐使用的前端开发工原创 2021-05-26 08:47:58 · 13801 阅读 · 61 评论 -
vue中的$nextTick()
$nextTick的定义原创 2021-05-14 10:47:32 · 601 阅读 · 4 评论 -
echarts 显示隐藏后宽度高度变小问题
正常情况下原创 2021-05-14 09:32:23 · 11697 阅读 · 3 评论 -
element el-cascader动态加载数据 (多级联动,落地方案)
前言最近需要用到element ui的这个插件做地区的四级联动,但是碰了一些问题:官网的说明太泛泛然,不易看懂 网上的教程乱七八糟,代码一堆一堆的 看这篇就对了!!! 效果图 =>点击确认后的值1. template <el-cascader size="mini" :props="props" @change="handleChange" v-model="value" style="w...原创 2021-05-13 21:17:13 · 19484 阅读 · 9 评论 -
vue Cannot read property ‘0‘ of undefined“ 问题及解决方案
问题分析1. 当我们表单取值时,如下:2.多级取值,例如取的值是:Obj.class.student.img[0]报错:报错翻译是:render中出错:“TypeError:无法读取未定义的属性“0”更奇怪的时候,界面正常显示,我们也能正常取到值,但开发者工具会报错。那这就是很多强迫症患者不能忍的了,,,原因及解决方案原因:vue中模板在渲染时候,读取对象中的某个对象的属性值时,这个对象中的某个属性并不存在(可能仍然在等待请求后台赋值),所以报错,接口请求到数..原创 2021-04-21 14:28:13 · 15486 阅读 · 1 评论 -
vue项目中使用echarts
1. 安装npm install echarts --savepackage.json中有此项,代表安装成功2.引入全部组件如果你项目里需要用到各种各样的图表,建议使用本条。main.js 中引入// 引入echartsimport echarts from 'echarts'Vue.prototype.$echarts = echarts使用export default { name: 'hello', data () { retu...原创 2021-04-03 10:52:22 · 12421 阅读 · 3 评论 -
Vue 常用API整理
关于API这东西,前端各个框架都是不同的,且都经常更新,不用死记,所以本篇博客记录一下Vue中业务上常用的API(稍复杂些的API,简单的略)Vue中的数组操作循环<ul> // FAQ: key值一般不取index(数组下标值) 取唯一的id值 //(若一个页面有多个数组,index会有多个,key值则失去了唯一性) <li v-for="(item, index) in list" :key="item.id">{{item.name}}</li>原创 2020-12-19 16:38:22 · 25310 阅读 · 4 评论 -
2021年,vue3.0 面试题分析(干货满满,内容详尽)
Vue3.0 对于我们前端人的重要性 —— 2021年面试必备2020年09月18日,vue3.0正式发布。随着它的发布,Vue.js再次被推上了前端的风口浪尖。同时,面试官的提问也将加入一些有关Vue3.0的新元素(相信近期去面试的小伙伴或多或少都会被问到Vue3.0的知识点)。那么接下来分析一波(本文讲的非常详细,争取大家都能看懂,对大家有所帮助):1. Vue3.0里有哪些是值得我们重点关注的点?2. Vue3.0中,哪些是面试官喜欢问的高频率问题?1. Vue3.0 .原创 2020-12-05 11:50:46 · 49811 阅读 · 19 评论 -
Vue中diff算法核心函数揭秘 —— patch函数
说在前面本文接上篇vue虚拟dom详解,会讲到以下几点:diff 算法的实现过程 diff 算法步骤说明 diff算法核心函数:patch()diff 算法的实现过程Vue的diff算法是基于snabbdom改造过来的,仅在同级的vnode间做diff。递归地进行同级vnode的diff,最终实现整个DOM树的更新。因为跨层级的操作是非常少的,忽略不计,这样时间复杂度就从O(n3)变成O(n)。diff 算法步骤说明1. 用 JavaScript 对象结...原创 2020-09-01 14:51:32 · 7946 阅读 · 1 评论 -
vue虚拟dom详解
从 vue1.x 设计理念说起对vue发展史比较熟悉的同学,应该知道这件事:vue1.0 并没有虚拟dom这玩意,而是是采用数据绑定、依赖收集的方式去观察数据变化并保留对实际 DOM 元素的引用,当有数据变化时进行对应的操作,每一个观测的render Watcher 对应的就是一个真实的DOM节点。好处是少量数据更新对比Virtual DOM 性能更好,坏处是大量数据更新、初始渲染性能、对比Virtual DOM 性能更差。渲染列表时当数据全新的时候,需要销毁之前的所有实例,重新创..原创 2020-08-28 22:11:26 · 1118 阅读 · 1 评论 -
深度剖析互联网一线大厂Vue面试题
熟练使用框架的必要性 说到使用前端框架,已经不是什么新鲜事了,目前大部分公司都会要求你熟练使用Vue或React框架,这也成了前端工程师面试的家常便饭。 所以这也是我们的必备技巧,同时也经历了一波发展变化,不得不防。那么,现在我去面试,面试官会问哪些关于Vue的问题呢?不要慌,客官接着往下看。 回顾一下16-19年Vue的经典面试题及分析: 1.父子组件传值(Vue面试高频题目,现在估计也会顺带提一下,不过相信大家都烂熟于心了)...原创 2020-05-31 13:15:28 · 1307 阅读 · 0 评论