Vue 响应式原理剖析 —— 数据更新常见问题
在 Vue 开发的过程中，多少都会遇到数据更新后，页面没有更新渲染这类问题。而在上两篇文章中，从「实例化」、「渲染」、「数据更新」三条线完整地讲述了 Vue「响应式」的工作原理，本文正是基于这些原理去解决一些常见的数据更新相关问题。...
Read More –>Kayo's Melody
前端工程师，现就职于微信
在 Vue 开发的过程中，多少都会遇到数据更新后，页面没有更新渲染这类问题。而在上两篇文章中，从「实例化」、「渲染」、「数据更新」三条线完整地讲述了 Vue「响应式」的工作原理，本文正是基于这些原理去解决一些常见的数据更新相关问题。...
Read More –>在上一篇文章中，梳理了 Vue 实例化和渲染的基本逻辑，并且介绍了订阅者模式这种设计模式，Vue 的「响应式」实现本质上也是一个订阅者模式，但是由于 Vue 需要考虑更加复杂的情况，并且需要在其中作出大量优化操作，因此具体实现也会复杂很多。下面通过更详细地说明 Vue「响应式」的实现，同时发掘在 Vue 中订阅者三要素分别是什么。...
Read More –>在系统地梳理「响应式」工作原理的过程中，也参考了不少现有的文章，大部分都是围绕“依赖收集”、“派发更新”或者“Watcher”，“Dep”这些响应式相关的概念逻辑展开讲述，当然这些概念和逻辑是必不可少的要展开讲述的内容，但是如果单纯围绕这些内容展开来编写一篇文章，对于理解「响应式」在整个 Vue 中的工作过程可能会感到困惑。因此，本文会换一个角度，从 Vue 使用的过程展开说明「响应式」的工作原理，即从「实例化」、「渲染」、「数据更新」三条线讲述「响应式」的工作过程。...
Read More –>在 Gulp 的官方文档中，Gulp 的任务都是写在 gulpfile.js 这一个文件中的，如果任务数量不多，这并不会有什么问题，但当任务数量较多时，会造成代码可读性差，难以维护，多人协作时还会容易造成冲突。因此，更好的处理方式是把 Gulp 的代码结构化。 开始结构化 https://github.com/QMUI/qmui_web 这是一个前端框架，主要由一个 SASS 方法合集与内置的工作...
Read More –>JavaScript 自定义事件就是有别于如 click, submit 等标准事件的自行定制的事件，在叙述自定义事件有何好处之前，先来看一个自定义事件的例子： <div id="testBox"></div> // 创建事件 var evt = document.createEvent('Event'); // 定义事件类型 evt.initEvent(...
Read More –>正如上一篇文章所述，最近趁着有空把 jQuery 的浏览器模块抽取出来，再修改成独立简洁的一个对象 —— support，可以方便地使用 JavaScript 进行特征检测。 是的，这里要介绍的，是特征检测而不是浏览器检测！ 由于 JavaScript 在不同的浏览器中存在差异，尤其是不同内核的浏览器之间的差异更是明显，因此在传统的前端开发中，在实现某些功能的过程中会判断浏览器的型号和版本，再实现一个跨浏览器的解决方...
Read More –>接着上一篇《Let's free of jQuery!》，上一篇主要介绍 jQuery 中最常用的一些方法的原生解决方案，本篇则会介绍余下相对较少用到的内容。 11. form 表单序列化 在 jQuery 中，有一个 serialize() 方法，该可以通过序列化表单值，创建 URL 编码文本字符串，在 ajax 提交表单时很有用，下面介绍一下原生的方法： function formToString(formO...
Read More –>8月份时，断断续续把整个网站的 JavaScript 重写了一遍，原因很简单，自这个博客创建以来，一直都是依赖于 jQuery 库，随着 jQuery 库的愈发臃肿，以及自身对于 JavaScript 的日渐熟悉，摆脱 jQuery 的想法也越来越强烈了，于是终于在上个月，达成目标了。这里必须补充一下，Kayo 之所以想摆脱 jQuery ，原因有二： 一是因为 jQuery 的体积已经比较臃肿了，加载需时，对于移...
Read More –>HTMl5 推出了一个很“特别”的 API Page Visibility ，之所以说它特别，是因为这个 API 关注的是一个很少人留意的功能 —— 浏览器标签( tab ) 是否被激活。这里必须解释一下，这个“激活”，指的是这个标签是否正被用户浏览，或者说是否为当前标签。 那么，这个 API 究竟有些什么用途呢？通常，很多传统的页面在用户没有激活它的时候，它还会继续工作，例如，当用户正在浏览新闻门户，而他之前打开的...
Read More –>偶遇两道 JavaScript 题目，觉得都比较有趣，分享一下。 第一道是很老的题目了，getElementsByClassName，写一下当作练习： 下面这个思路比较简单，基本也是 Robert Nyman 的思路了，判断了 IE5 中使用原生的 all 属性代替其不支持的 getElementsByTagName ，使用 indexOf 判断相应的 class 是否匹配。 function getElemen...
Read More –>jQuery Mobile 在刚推出的时候，曾经宣传了几个重要的特点，除了 Kayo 在本系列文章中多次介绍的“触摸屏优化”外，另外一个最直接的特点就是“响应式设计”，关于响应式设计，Kayo 已经写了不少相关的文章进行说明，而本文要介绍的，是 jQuery Mobile 中为响应式设计作出的优化和工具。 在 jQuery Mobile 测试版本的文档中，有一个栏目名为“Responsive Layout Helpe...
Read More –>本文承接上文《使用 jQuery Mobile 与 HTML5 开发 Web App —— jQuery Mobile 方法上》，继续说明 jQuery Mobile 的方法，这部分内容主要与页面 URL 解析相关，除此之外还有其他一些实用方法。 以下两个方法在 jQuery Mobile 1.1 中不赞成使用 八. $.mobile.fixedToolbars.show() 固定工具栏（包括固定的头部栏和尾部栏）可...
Read More –>