cici Blog

我干了什么 究竟拿了时间换了什么

iview Form表单验证

async-validator相关及踩坑

手头的项目有一个需求是创建自定义表单模板，深入使用了iview的Form控件，踩了不少iview的坑，同时也锻炼了validate相关的能力。 基本知识 Form由一些FomeItem组成，可以为Form设置rule来指定相关表单项的限制条件。 通过$ref 可以访问到 Form 组件，调用 validate 函数，即可获取相应的校验函数。iview中，Form验证是根据FormIt...

Posted by cici on September 19, 2018

vue中实现基础组件——拖拽组件

简单实现拖拽组件——drag & drop

前言 pc端开发需要拖拽组件完成列表的顺序交换，一般移动端的UI组件会包含，但是我在用的iview并没有此功能的组件，于是手写一个，实现起来很简单。效果图如下： 可以拖拽完成新排序，点击某一项可以触发相关事件. 关于拖拽 drag & drop 拖放（Drag 和 drop）是 HTML5 标准的组成部分。 拖拽对象 dataTransfer对象，只能在拖放事件的事...

Posted by cici on September 17, 2018

关于Vue中nextTick()的思考

nextTick是怎么利用JS中的异步方法的？

　　我的项目中有一个swiper插件，在vue实例created(生命周期相关)函数中，先用ajax异步加载数据，再初始化swiper轮播插件时，遇到了一个问题，由于动态数据加载导致了swiper初始化后会滑动到最后一个item。我当时的解决方法是用setTimeout()来延迟初始化，之后在学习es6的时候，我发现更好的解决办法是使用promise.then.但是，没有最后只有更好，pro...

Posted by cici on October 27, 2017

如何更快地构建与渲染

加速构建可以从CSS/HTML/JS多方面入手

在上一篇中，我详细描述了浏览器渲染的过程，那么，如何来提升渲染效率，使页面更快的加载完成呢。 我将这些方法分为几部分分别介绍。 CSS部分 1. 媒体类型和媒体查询 将CSS分割为片段，对于不同的浏览器，不同的终端，不同的阅读模式，应用不同的CSS样式表。如果将这些内容写到统一个文件中，浏览器需要下载并解析他们。所以我们应该将这些内容通过对link元素的media属性来指定： 1 2...

Posted by cici on October 16, 2017

JS——事件绑定与处理总结（上）

不同内核浏览器的事件处理方式有差异

　　JavaScript与HTML之间的交互是通过事件实现的。 事件是指文档或浏览器窗口发生的一些特定的交互瞬间，可以用监听器（或处理程序）来预定事件，以便在事件发生时执行相应的代码。——摘自《高程》 理解事件是实现良好交互的必要条件，本文旨在系统地总结事件相关知识。 (上)主要内容： 理解事件流 使用事件处理程序 1.理解事件流 事件流描述的是从页面中接收事件...

Posted by cici on October 14, 2017

完整渲染过程——从URL到页面

页面渲染过程发生了什么?

当用户输入一串URL（统一资源定位符）到完整的页面渲染出来，到底经历了什么呢。 首先列出大概流程： 浏览器根据请求的URL交给DNS域名解析，找到真实的IP，向服务器发起请求 服务器交给后台处理完后返回数据，浏览器接受文件（HTML/CSS/JS/图像等） 浏览器对加载到的数据进行解析，建立起相应的内部结构 载入解析到的资源文件，渲染页面，完成 我们主要分为两部分具体...

Posted by cici on October 6, 2017

笔试总结（HTTP(S)/虚拟内存/xhr）

记录-复习

同花顺的笔试完虐我这种渣渣，没有选择填空，只有问答和编程题，且大部分C++/JAVA,完全懵逼， 陌陌的算法题60分，也懵到题目都搞不清楚 完美世界的比较均衡，选择很基础，编程题也不难，只是我的编译一直不通过很伤 下面总结一下不太清楚的知识点 1.虚拟内存 虚拟内存是计算机系统内存管理的一种技术。它使得应用程序认为它拥有连续的可用的内存（一个连续完整的地址空间），而实际上，它通常是被分隔...

Posted by cici on October 3, 2017

JS——正则详解

JS——RegExp

Update: 文章内容摘自阮一峰大大—RegExp对象，总结一下方便自己记忆 1.正则匹配规则 字面量字符串 /dog/ 匹配 ‘dog’ 元字符 点字符（.） 匹配 除回车（\r）、换行(\n) 、行分隔符（\u2028）和段分隔符（\u2029）以外的所有字符。 位置字符（^ / $） ^/$ 表示字符串开始/结束的位置 ...

Posted by cici on October 3, 2017

JS Test（44道）总结

记录-复习

题目来自javascript-puzzlers 1.reduce 没有设置初始值的空数组使用reduce方法会抛出错误 reduce的callback函数有四个参数，preValue，curValue，curValue-index，array，如果没有设定初始值，reduce开始时第一个值为preValue，第二个为curValue 2.map&parseInt m...

Posted by cici on October 1, 2017

基本包装类型

一些基础知识

好久之前看的高程，最近有些忘记了，疑惑基本包装类型存在的意义，下面总结一下 为了便于操作基本类型，ECMAScript提供了三个特殊的引用类型：Boolean、Number、String。 　　实际上，每当读取一个基本类型值的时候，后台就会创建一个对应的基本包装类型的对象，从而让我们能够调用一些方法来操作这些数据。 　　 1 2 var s1="nice"; var s2=s...

Posted by cici on September 19, 2017

FEATURED TAGS
JavaScript React-Native Mobile React debug js异步 mobile rendering
ABOUT ME

For the next quantum leap
离开世界之前，一切都是过程

RECOMMOND