redux 理解

什么: redux 是专门做状态管理的独立第三方库，不是 react 插件
作用: 对应用中状态进行集中式的管理(写/读)
开发: 与 react-redux，redux-thunk 等插件配合使用

redux 相关 API

redux 中包含: createStore()，applyMiddleware()，combineReducers()
store 对象: getState()，dispatch()，subscribe()
react-redux:，connect()()

redux 核心概念(3 个)

Bower：客户端库管理工具

概述

随着网页功能变得越来越复杂，同一张网页加载多个 JavaScript 函数库早已是家常便饭。开发者越来越需要一个工具，对浏览器端的各种库进行管理，比如搜索、自动安装\卸载、检查更新、确保依赖关系等等。Bower 就是为了解决这个问题而诞生的针对浏览器端的库管理工具。

Bower 基于 node.js，所以安装之前，必须先确保已安装 node.js。

1

sudo npm install bower --global

重绘(repaint)

当元素样式的改变不影响布局时，浏览器将使用重绘对元素进行更新，此时由于只需要 UI 层面的重新像素绘制，因此 损耗较少。

回流(reflow)

当元素的尺寸、结构或触发某些属性时，浏览器会重新渲染页面，称为回流。此时，浏览器需要重新经过计算，计算后还需要重新页面布局，因此是较重的操作。

会触发回流的操作

参考资料： http://www.lua.org/start.html

LUA 的值与类型

Lua 中有八种基本类型： nil、boolean、number、string、function、userdata、 thread 和 table。

LUA 的特点之 TALBE

1. Table = 数组 + 映射
   

2. 程序猿从 0 开始，大众习惯从 1 开始

安装 svg-sprite-loader

1

npm i -S svg-sprite-loader

更改 build/webpack.base.conf.js 配置文件

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

{
test: /\.svg$/,
  loader: 'svg-sprite-loader',
  include: [path.resolve(__dirname, '../src/images/icons')],
  options: {
      //symbolId: 'icon-[name]' //这个没有生效，生效的是默认的name
  }
},
{
  test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
  loader: 'url',
  exclude: [resolve('src/icons')],
  query: {
    limit: 10000,
    name: utils.assetsPath('img/[name].[ext]')
  }
}

下载 svg 文件并放入 src/icons/svg/目录下

$options

用于当前 Vue 实例的初始化选项。需要在选项中包含自定义属性时会有用处
使用代码如下：

1

this.$options.data(); // 获取当前 vue 实例化的初始数据 data

$attr

包含了父作用域中不作为 prop 被识别 (且获取) 的特性绑定 (class 和 style 除外)。当一个组件没有声明任何 prop 时，这里会包含所有父作用域的绑定 (class 和 style 除外)，并且可以通过 v-bind=”$attrs” 传入内部组件——在创建高级别的组件时非常有用。
使用代码如下：

网页可见区域宽：

1

document.body.clientWidth;

网页可见区域高：

1

document.body.clientHeight;

网页可见区域宽：

ES6 的变量声明： let 和 const

ES6 中新增了 let 和 const 来定义变量：

• var：ES5 和 ES6 中，定义全局变量（是 variable 的简写）。
• let：定义局部变量，替代 var。
• const：定义常量（定义后，不可修改）。

var：全局变量

看下面的代码：

本文主要介绍 popstate 事件监听的作用。

pushState

在 HTML 文件中, history.pushState() 方法向浏览器历史添加了一个状态。
pushState() 带有三个参数：一个状态对象，一个标题（现在被忽略了），以及一个可选的 URL 地址。

state object

状态对象是一个由 pushState()方法创建的、与历史纪录相关的 JS 对象。当用户定向到一个新的状态时，会触发 popstate 事件。事件的 state 属性包含了历史纪录的 state 对象。（译者注：总而言之，它存储 JSON 字符串，可以用在 popstate 事件中。）state 对象可以是任何可以序列化的东西。由于 火狐 会将这些对象存储在用户的磁盘上，所以用户在重启浏览器之后这些 state 对象会恢复，我们施加一个最大 640k 的字符串在 state 对象的序列化表示上。如果你像 pushState() 方法传递了一个序列化表示大于 640k 的 state 对象，这个方法将扔出一个异常。如果你需要更多的空间，推荐使用 sessionStorage 或者 localStorage。