vue挖坑之路
记录自己学习vue的过程中踩过的坑
少年民仔
青春是用来拼搏的,不是用来挥霍的!
展开
-
基于 vue 的可插拔架构设计
什么是可插拔架构简单来说,可插拔架构就好比是一个插排,可以连接一个及以上的插头,插头插上或者拔下都不影响插排的正常使用,插上去某个插头连接的电器可用,拔下来,该电器停用。而在我们前端体系中,一个个带插头的电器可以看成是项目上的各个模块,插排就是我们的项目主体(或者叫基座工程),通过配置文件来定义需要安装在基座上的模块信息,子模块的插拔不会影响基座工程的正常运行,从而达到前端模块的热部署(热插拔)。这也是微前端解决方案的一种,关于微前端的概念,应用场景,使用意义等在这里就不多说了,感兴趣的童鞋可以自行go原创 2020-09-29 14:03:58 · 2626 阅读 · 0 评论 -
如何优雅的使用 Vue Router History 模式
如果不想要很丑的 hash,我们可以用路由的 history 模式,这种模式充分利用 history.pushState API 来完成 URL 跳转而无须重新加载页面。 —— Vue Router 官网为啥要使用 History 模式还能有什么原因,hash 模式的 # 不好看呗,当然了,我们也不能仅仅只看颜值,还有一些其他原因,例如 hash 模式下对一些需要锚点功能的需求会和他的路由...原创 2019-07-05 11:11:29 · 6571 阅读 · 2 评论 -
Vue 使用的一些小技巧
We can’t change history, but we can change the future. --忘了哪里看到的起手最近一直在用 Vue 开发,期间并没有很认真的做个总结,本文也只是对自己印象较为深刻的点列举一二。Router key由于 Vue 会复用相同组件,例如 /page?id=1 => /page?id=2 这类跳转的情况,组件将不会执行 created...原创 2019-07-05 11:09:43 · 1350 阅读 · 1 评论 -
如何打造更快更轻的 Vue 应用
本文主要针对自己最近项目中遇到的一些问题,并参照网上的一些文章,整理了部分 Vue 性能优化上的点。代码优化v-show 和 v-if 的使用使用了v-if的时候,如果值为false,那么页面将不会有这个 html 标签生成,而v-show则不管值为 true 还是 false,html 元素都会存在,只是 CSS 中的 display 显示或隐藏, 因此需要频繁切换的用 v-show。...原创 2019-07-05 11:08:12 · 268 阅读 · 0 评论 -
从零搭建vue+express开发环境
该项目是在学习vue过程中,秉着前后端分离的态度,尝试着自己搭建vue+express环境搭建vue项目安装vue-cli脚手架npm install -g vue-cli创建基于webpack模版的项目vue init webpack firstapp安装包依赖并运行cd firstappnpm installnpm run dev在浏览器上输入localhost:8080,这就是原创 2018-01-12 14:36:41 · 15846 阅读 · 13 评论 -
Vue beforeRouteEnter 的next执行时机
背景今天在用vue实现界面的时候,想在beforeRouteEnter钩子函数中去获取数据,然后通过next方法设置到跳转页面的实例中,结果发现数据一直没办法在界面渲染的时候赋值,苦思不得其解,遂google之,终寻原因,记录之。注意beforeRouteEnter (to, from, next) { console.log(this); //undefined,不能用this来获取vu原创 2018-01-23 21:15:19 · 19395 阅读 · 3 评论 -
vue组件参数传递命名
背景今天在父子组件传值的时候,父组件的值死活传不到子组件中,断点调试也没有值,后来打开控制台发现警告信息,html语句中不识别大写字母,再一看,参数是驼峰命名,难不成是这个问题,遂百度之,确实如此,html中不支持大下写,所以父组件传值的时候,参数名应该用短横线连接。注意错误示例:<my-component :userName='userName'></my-component>正确示例:<my-c原创 2018-01-24 20:34:29 · 1088 阅读 · 0 评论 -
Vue 源码学习之 diff 算法
学习源码可以让我们更加深入的了解框架的思想,以便我们能够更好的利用框架前言之所以写这篇文章,一个是因为最近看了 vue 的相关源码,也看了不少大佬们对 diff 算法的分析,本着学习的态度,总结一下自己对 diff 算法的一些理解,不求能比大佬们讲的出色,只希望能讲清楚自己学习 diff 算法的心路历程,还有一个比较重要的原因是之前在群里看到有人问为什么 v-for 遍历的时候需要指定 k...原创 2019-09-16 09:27:18 · 538 阅读 · 0 评论 -
Vue 源码学习之事件机制
前言写这篇文章的起因是因为今天组里的小伙伴问了我一个比较常见的语法的原理,而我用了这么久的 vue,对该写法早已熟能生巧,但一谈到如何实现,突然愣住了,这玩意儿好像真没注意过,那么是什么问题呢?看下面代码。<div @click="onClick">测试</div><div @click="onClick($events, '测试')">测试</di...原创 2019-09-20 15:12:48 · 321 阅读 · 0 评论