11k 字 10 分钟

两个月之前在项目中就开始使用 Eslint ，当时直接 copy 别人的 .eslintrc.js 文件，感觉好复杂，一直没吃透，中间去把 Eslint 官方文档看了数遍，依然无果。今天刚好没事，回过头来想整理一下 Eslint 的使用，突然发现变得好简单。总结下在这过程中走得弯路。

  • 先要知道 Lint 是什么，Eslint 又是什么；
  • 因为想要的太多（想把 Eslint 官方文档里每个字都记住）就容易抓不住重点（目的是在项目中使用 Eslint，这仅仅是个工具，工具又怎么会搞的太难）。
4k 字 4 分钟

蜂巢布局，顾名思义，就是模仿蜜蜂蜂巢的六边形排列方式，将页面元素像蜂巢一样紧密排列。它不仅美观，还能最大化利用空间，让你的页面瞬间高级起来。

# 直接上效果

img

14k 字 13 分钟

这篇文章介绍了 Vue.js 父子组件之间通信的十种方式，不管是初学者还是已经在用 Vue 的开发者都会有所收获。无可否认，现在无论大厂还是小厂都已经用上了 Vue.js 框架，简单易上手不说，教程详尽，社区活跃，第三方套件还多。真的是前端开发人员必备技能。而且在面试当中也往往会问到关于 Vue 方面的各种问题，其中大部分面试官会问到如上这种问题。

# 概述

几种通信方式无外乎以下几种：

  • Prop（常用）
  • $emit (组件封装用的较多)
  • .sync 语法糖 （较少）
  • $attrs 和 $listeners (组件封装用的较多)
  • provide 和 inject （高阶组件 / 组件库用的较多）
  • 其他方式通信
312 字 1 分钟

在 Chrome 里安装插件时无法拖拽进去或者加载解压文件夹时看不到需要安装的文件，我面临的问题是权限问题。 1，修改 Chrome 拓展程序的权限 输入网址： chrome://flags/#extensions-on-chrome-urls ，把 Extensions 的权限改成 Enabled。 2，修改系统权限 打开 window+r，输入 regedit，找到 HKEY_LACAL_MACHINE\SOFTWARE\Microsoft\Windows\CurrentVersion\Policies\System ，把 EnableLUA 的权限改成 0。 BTW，俺用的是 win10...
2.5k 字 2 分钟

# Vue 动态组件 component :is 的使用

vue 动态组件用于实现在指定位置上，动态加载不同的组件，核心代码为：

<component :is="componentTag"></component>
data() {
    return {
        componentTag: '',
    }
}

componentTag 为自定义的变量，将需要加载的组件名赋值给它，即可在 component 标签出现的位置，渲染该组件。

542 字 1 分钟

JSON 本身是不支持正则表达式的，所以我们需要转换传递正则的方式。

# 方式 1

1. 假如有个正则表达式为

// 字符长度为 1 到 16 之间
const regex = /^.{1, 15}$/

2. 那么，JSON 格式可以写为

{
	"regex": "^.{1, 15}$"
}

3. 然后，解析时采用

const regexp = new RegExp(regex)
regexp.test('11111')

1.8k 字 2 分钟

# 判断是否为合法的 url var strUrl= "^((https|http|ftp|rtsp|mms)?://)" + "?(([0-9a-z_!~*'().&amp;=+$%-]+: )?[0-9a-z_!~*'().&amp;=+$%-]+@)?" //ftp 的 user@ + "(([0-9]&#123;1,3&#125;\.)&#123;3&#125;[0-9]&#123;1,3&#125;" // IP 形式的 URL-...
981 字 1 分钟

# 实例

设置一些不同的列表样式：

# 无序列表实例

ul.circle {list-style-type: circle}
ul.square {list-style-type: square}

# 有序列表实例

ol.upper-roman {list-style-type: upper-roman}
ol.lower-alpha {list-style-type: lower-alpha}

2.2k 字 2 分钟

# list-style-type 属性定义及用法

在 css 中，list-style-type 属性是使用来设置列表项标记的类型，在有序列表和无序列表中经常都会使用该属性。

目前，所有主流浏览器都支持 list-style-type 属性，但是任何版本的 Internet Explorer（包括 IE8）都不支持属性值 "decimal-leading-zero"、"lower-greek"、"lower-latin"、"upper-latin"、"armenian"、"georgian" 或 "inherit"；

如果需要同时设置多个列表属性，可以使用 list-style 属性，list-style 属性可以在一个声明中同时设置 list-style-type（列表项标记的类型）, list-style-position（何处放置列表项标记）, list-style-image（图像来替换列表项的标记）属性；