书架

书架

=一个知识书库=

JS事件冒泡与捕获

JS事件冒泡与捕获

#### 什么是冒泡与捕获 ​ 以click点击事件为例。假如我们有一个多层结构标签。如下图,是4个div嵌套。每个div都有点击的监听事件,分别输出1234。当我们点击最里面的div时,点击事件开始传递,传递的**全过程是1-2-3-4-4-3-2-1**。 前半部分,事件从最外面的父div依次传递到最里面的后代div,**1-2-3-4这部分我们叫捕获过程**。 之后事件又从最里层的后代div逐层传出,**4-3-2-1这部分我们叫冒泡过程**。 <!--more--> 如果我把捕获监听器和冒泡监听器都加上,如下图这样。 ![事件传递](http://ww
more...
Vue-Cli 3.x 创建的项目中对 import 引入的 CSS 样式启用 autoprefixer

Vue-Cli 3.x 创建的项目中对 import 引入的 CSS 样式启用 autoprefixer

**问题描述:** Vue-Cli 3.x 默认开启了 autoprefixer,但对于在 main.js 中通过 import 引入的 CSS 并没有自动添加前缀 **分析原因:** autoprefixer 在项目编译的时候,会根据 loader 的规则编译相应的 CSS。Vue-Cli 创建的项目,默认只处理了 .vue 文件中的 CSS,对于直接 import 引入的样式,需要另外配置 loader 规则。 **解决方案:** 在 vue.config.js 中添加 CSS 规则: ``` module.exports = {
more...
Vue中使用svg

Vue中使用svg

1.安装依赖 ```bash npm install svg-sprite-loader --save-dev ``` 2.在src/components下新建文件夹及文件SvgIcon/index.vue ![img](http://www.lixianglong.cn/bg_store/img/content/1759118-20201008162554181-1800856302.png) ```javascript <template> <svg :class="svgClass" aria-hidden="true" v-on="$listener
more...
Vue v2.4中新增的$attrs及$listeners属性使用教程

Vue v2.4中新增的$attrs及$listeners属性使用教程

# 前言 多级组件嵌套需要传递数据时,通常使用的方法是通过vuex。如果仅仅是传递数据,而不做中间处理,使用 vuex 处理,未免有点杀鸡用牛刀。Vue 2.4 版本提供了另一种方法,使用 v-bind=”$attrs”, 将父组件中不被认为 props特性绑定的属性传入子组件中,通常配合 interitAttrs 选项一起使用。之所以要提到这两个属性,是因为两者的出现使得组件之间跨组件的通信在不依赖 vuex 和事件总线的情况下变得简洁,业务清晰。 <!--more--> **首先分析以下应用场景:** ![img](http://www.lixianglong.cn
more...
Redis主从复制,哨兵机制、Redis集群

Redis主从复制,哨兵机制、Redis集群

![Redis主从复制,哨兵机制、Redis集群](http://www.lixianglong.cn/bg_store/img/content/v2-66f7f0dff908cff33102fcd3300f4dc2_1440w.jpg?source=172ae18b) 如果Redis的读写请求量很大,那么单个实例很有可能承担不了这么大的请求量,如何提高Redis的性能呢?你也许已经想到了,可以部署多个副本节点,业务采用读写分离的方式,把读请求分担到多个副本节点上,提高访问性能。要实现读写分离,就必须部署多个副本,每个副本需要实时同步主节点的数据。 <!--more--> > 这篇文
more...