VUE专场
Joy__Yue
这个作者很懒,什么都没留下…
展开
-
Vue.js 父子组件通信的十种方式
转载微信上的一篇文章1、prop这个在我们日常开发当中用到的非常多。简单来说,我们可以通过 Prop 向子组件传递数据。用一个形象的比喻来说,父子组件之间的数据传递相当于自上而下的下水管子,只能从上往下流,不能逆流。这也正是 Vue 的设计理念之单向数据流。而 Prop 正是管道与管道之间的一个衔接口,这样水(数据)才能往下流。浏览器输出2、$emit官方说法是触发当前实例上的事件...转载 2018-11-06 20:09:45 · 23271 阅读 · 0 评论 -
Vue.js是如何做到数据响应的?
Vue数据响应原理https://mp.weixin.qq.com/s/1wPePhAoBtsb0XcUzFSfug转载 2019-01-14 15:08:45 · 257 阅读 · 0 评论 -
优雅使用 Element-UI 的 Loading 组件
Element-UI 提供了 Loading 组件,通过对于这个组件进行一些处理,我们能做到在发送请求的时候进行 loading 操作转载记录:https://www.jianshu.com/p/95ec2286bc6d转载 2018-12-13 17:51:00 · 1716 阅读 · 0 评论 -
beforeRouteEnter (to, from, next)获取前后下的路由
在某个页面文件内(如welcom.vue)用beforeRouteEnter (to, from, next)可以获取前后下的所有路由,在项目开发中经常会用到。比如用来做路由跳转控制、在路由跳转前或后调用方法等。其中遇到的一个问题是,要点击浏览器返回按钮返回上一页,但我们这个项目进入首页前还有一个动画页(也就是说,只点一次返回按钮,是到动画页,动画页自动鉴权又直接进了首页,导致看起来是没有正常...原创 2018-12-13 16:33:05 · 14210 阅读 · 0 评论 -
错误:Cannot read property ' editIndex' of undefined
报undefined错误时,最基本的就是没有定义。而这里要提到的原因是关于this的原因:在回调函数中用的this去取值,this的指向乱掉,找不到该字段值,陷入“回调地狱”解决方法:在回调中用箭头函数,或者在函数块开头用let self = this,用self去取字段值...原创 2018-12-13 15:23:07 · 2341 阅读 · 0 评论 -
报错:Cannot read property 'xxx' of null
这个错误在开发时经常遇到,这里谈谈引起该问题的其中一种可能原因及解决方法,希望能帮到你。开发场景:用for循环渲染列表,列表中需要渲染某个字段值,该字段值报null错误原因:列表数据很多,没有一一查看每条数据该字段值是否都有。一旦某条数据的该字段值为空,就会报这个错误,进而整个列表不能渲染解决方法:在用for循环的html标签上加上v-if="该字段值"。意思是,如果字段值为空,就不渲...原创 2018-12-13 15:06:06 · 35639 阅读 · 1 评论 -
Vue父组件如何调用子组件的方法
对文章Vue.js 父子组件通信的十种方式做一个补充:在父子组件通信中,父组件如何调用定义在子组件的方法1、父组件文件,使用子组件时,声明ref属性:<v-header ref="header"></v-header>2、父组件函数中,用this.$refs调子组件的数据或方法:如:this.$refs.header.属性名this.$refs.hea...原创 2018-11-30 19:12:21 · 18908 阅读 · 3 评论 -
网页首屏优化及骨架屏
打开应用时,有没有遇到过首屏白屏的情况?浏览器渲染页面,在等待HTML文档返回时,会处于白屏状态,用户体验不好,没有任何引导和缓冲那么,有没有看到过这种界面?看到这种界面时,用户一般认为页面正在加载,是值得等的这就是骨架屏,加强了用户体验骨架屏现在有越来越多的应用,这篇文章就是关于如何解决首屏白屏加载问题以及骨架屏实现的介绍几篇文章,按顺序看能更明白些:美团网页首屏...转载 2018-11-30 11:00:18 · 1188 阅读 · 0 评论 -
Vue响应式原理及实现
一直认为明白Vue的底层实现原理很重要,能给你提供高效正确的开发思路,但深挖原理也确实有难度这里推荐一篇讲Vue响应式原理的文章,希望能从中有点收获https://mp.weixin.qq.com/s/WqsmZ2UL_5ZulOct5e37DQ...转载 2018-11-30 10:41:25 · 798 阅读 · 1 评论 -
Vue高版本中一些新特性的使用
主要包括以下几点:深度作用选择器( >>> )我在另一篇文章中也有提到这点Vue: scoped 样式与 CSS Module 对比组件配置项inheritAttrs、组件实例属性$attrs和$listeners发生在父子组件之间组件选项 provide/inject发生在父子组件之间作用域插槽 slot-scope在组件中小细节的需求变化中很实...转载 2018-11-17 11:07:28 · 232 阅读 · 0 评论 -
Vue: scoped 样式与 CSS Module 对比
每个通过 vue-cli 创建的 Vue.js 应用都内置了两个很好的解决方案:Scoped CSS 和 CSS Modules (模块式 CSS)。两种方案各有优缺点,我们来看下哪种方案在你的案例中更适用。Scoped 样式我们只需要在 style 标签上添加一个 scoped 属性即可启用 scoped 样式:这样就会使得我们的样式只被应用到这个组件中的元素上。这是借助 PostC...转载 2018-11-17 10:56:16 · 878 阅读 · 0 评论 -
用v-for时v-bind:key值用什么绑定比较好,key?index?或者item.id?
我们知道v-for有三个参数:value,key,index,在用v-for时需要绑定唯一的索引值,这时就要考虑三种绑定值效果是否一致?会不会有潜在的问题?用哪个比较好?看到一篇博文,用实验验证了这个问题,特转载学习,附上链接:https://www.cnblogs.com/tim100/p/7262963.html?tdsourcetag=s_pcqq_aiomsg...转载 2018-11-07 11:36:26 · 5000 阅读 · 0 评论 -
深入 Vue 生命周期
“微信上看到一篇文章,觉得把VUE生命周期讲的不错,特转载学习”这篇博客将会从下面四个常见的应用诠释组件的生命周期,以及各个生命周期应该干什么事1、单组件的生命周期2、父子组件的生命周期3、兄弟组件的生命周期4、宏mixin的生命周期生命周期:Vue 实例从开始创建、初始化数据、编译模板、挂载Dom→渲染、更新→渲染、卸载等一系列过程,我们称这是 Vue 的生命周期,各个阶段有相对应的...转载 2018-11-02 19:36:51 · 126 阅读 · 0 评论 -
vue 监听路由变化
https://www.cnblogs.com/crazycode2/p/8727410.html转载学习,请仔细查看转载 2019-02-22 14:53:31 · 853 阅读 · 0 评论