Javascript

  • 这里说的自动格式化是指当用户在输入框里面输入数字,例如银行卡号,为了方便用户输入,希望在输入过程中对输入数字进行加空格处理,优化用户体验

    先看一下例子: http://jsfiddle.net/am0200/qugp8tvL/

    注意例子里面的输入框的类型是 tel,而不是 number,主要原因是 number 类型

    • 会导致 Android 上某些系统不显示 placeholder
    • 无法插入非数字内容,例如空格

    代码实现

    data-gap 代表第几位开始加空格,不为 0

    <input data-gap=4 maxlength="24" size="30" autocomplete=
  • 原理就是将要排序的数组的每一个项作为 setTimeout 时间参数,然后就可以排序了

    排序时间跟数组最大值绝对值有关 :)

    需要对数组的负数项做一下处理,因为 setTimeout 参数负数的话跟参数 0 是一样的

    例子 JSFiddle

    具体代码说明:

    // 需要排序数组
    const numbers = [8, 0, 3, -1, 9, -3, -767, 4, 111, 999, 89];
    
    async function sortArr(arr) {
      const left = arr.filter(a => a < 0).map(a => a * -1) // 获取
  • ithinkimight.com 这个网站图片来自 Instagram,图片随机大小,位置也是随机,图片可以重叠,但是并没有 过分 重叠。这种随机大小,位置排版页面元素跟平常的整齐 grid 或者 瀑布流 风格很不一样,下面我们尝试一下实现类似效果

    从网站源文件上看并不能看出网站是如何随机排布这些图片,因为是后端直接输出图片的位置参数,并不是前端实现的位置计算。不过这里有一种简单方法,可以实现类似效果。先看一下具体效果

    例子以及实际运用效果

    http://jsfiddle.net/am0200/1mn5xbf8/

    http://stone.am0200.com/

    实现思路

    首先把 conta

  • 这里使用 AcyOrt 的 JSON 输出插件输出博客内容,基于 vue + webpack 组合开发的一个博客。

    DEMO: http://aksdj4.am0200.com/

    项目地址: https://github.com/acyortjs/aksdj4

    JSON

    使用 acyort-json 将项目 Recordum issue 生成 JSON: https://github.com/acyortjs/aksdj4/tree/gh-pages/json

    开发说明

    基于 webpack 2 + vue 2,值得注意的是 vue-loader 已经包含了 vue-hot-reload

  • 前言

    接触过react的人应该对redux并不陌生。但是,redux并不是react的伴生产物,即使你使用其他类库,也可以使用redux框架来管理状态,但是,有react如此好的选择,没人会考虑其他的技术选型。但是,多多少少还是会有人误解redux。

    正文

    redux框架在使用过程中有三个原则:

    1. 唯一的状态树(数据源)
      The first principle of Redux is whether your app is a really simple one like this counter example, or a complex application with a lot of