guqing
毕生所求无它，爱与自由而已
从零开始学 Vue2 到项目开发
webpack.config.js完整示例配置： 11.5ECMAScript6语法转ECMAScript5语法 需要安装的node包有： babel-core babel-loader babek-plugin-trabsform-runtime:这个包主要是打包.vue组件页面中的es6语法需要 在项目目录下打开cmd命令面板输入： 在webpack-config.js中配置这两个loader 完整的配置为： 在main.js中使用es6语法导入site.css 各依赖版本: 11.6利用webpack解析和打包.vue组件页面 Vue项目中的每个页面其实都是一个.vue的文件，这种文件，Vue称之为组件页面，必须借助于webpack的vue-loader才能使用 所以必须安装相关包： vue : vuejs核心包 vue-loader : .vue文件编译loader babel-plugin-transform-runtime : es6实时转成es5语法 1.在项目根目录下打开cmd命令面板，输入： 2.在webpack.config.js中添加如下配置（只能在webpack1.0中使用）： 在webpack2.0中在webpack.config.js文件中添加babel:{}是不认识的要改写如下方式： 在项目根目录下新建.babelrc文件，内容填写如下： 3.在webpack.config.js的loader中增加 12 搭建webpack1.14.0+Vue2.6.0的HelloWorld App.vue文件 ::: demo ::: main.js文件 index.html模板index1.html web.config.js文件 package.json文件 13 项目中使用的ECMAScript6语法 1.对象的写法 2.在对象中的方法写法 3.对象的到出写法 4.对象的导入 5.es6中的箭头函数的写法 14 webpack项目中集成vue-router步骤 1.安装vue-router: 2.在webpack打包入口js文件中（entry指定的哪个文件main.js）配置如下： App.vue文件 在component/account/下写login.vue文件 在component/account/下写regist.vue文件 15Vue移动组件mint-ui使用 vue拥有很多的第三方开发的PC端或者移动端UI组件，此项目中主要用到了Vue移动端组件：mint-ui 类似的移动端组件还有： 1.vux 2.淘宝团队开发的：SUI 3.muse-ui PC端组件： 1.饿了么团队开发的：element 2.iView是一套基于Vue.js的开源UI组件库，主要用于服务PC界面中的后台产品 mint-ui资源介绍 下载地址： 2.官网： 3.文档地址： 安装mint-ui集成到项目中 1.安装： 2.在main.js中全局导入mint-ui和它的css后即可在任何组件中使用mint-ui组件了 16.MUI介绍 官网 文档地址 github地址 直接使用git克隆项目到本地然后查看 目录中的实例，复制代码使用，dist目录中是需要的js和css 使用时在入口文件中导入 使用：例如使用mui的九宫格样式
Vue中input框手动赋值成功却无法再编辑input框的值
如下示例： 如此这样，表单虽然值回显的但是确实无法修改input框中的值的。 根据官方文档定义：如果在实例创建之后添加新的属性到实例上，它不会触发视图更新 由此Vue实例创建时，helloForm.属性名并未声明，因此Vue就无法对属性执行 getter/setter 转化过程，导致helloForm属性不是响应式的，因此无法触发视图更新。 解决的方式有两种，第一种就是显示的声明helloForm这个对象的属性，如： 其次也可以使用使用Vue的全局API: $set()赋值：
如何使用和查看 MySQL 慢日志
慢查询日志配置 默认情况下slow_query_log的值为OFF，表示慢查询日志是禁用的，可以通过设置slow_query_log的值来开启，如下所示： 也可以通过修改配置文件的方式开启慢日志，修改my.cnf文件或者my.ini，增加或修改参数slow_query_log 和slow_query_log_file后，然后重启MySQL服务器，如下所示 慢日志的阈值 那么开启了慢查询日志后，什么样的SQL才会记录到慢查询日志里面呢？
MySQL 如何使用 explain 执行计划
explain执行计划包含的信息 其中最重要的字段为：id、type、key、rows、Extra 字段详解 id select查询的序列号，包含一组数字，表示查询中执行select子句或操作表的顺序 三种情况： 1、id相同：执行顺序由上至下 2、id不同：如果是子查询，id的序号会递增，id值越大优先级越高，越先被执行 3、id相同又不同（两种情况同时存在）：id如果相同，可以认为是一组，从上往下顺序执行；在所有组中，id值越大，优先级越高，越先执行 select_type 查询的类型，主要是用于区分普通查询、联合查询、子查询等复杂的查询 1、SIMPLE：简单的select查询，查询中不包含子查询或者union 2、PRIMARY：查询中包含任何复杂的子部分，最外层查询则被标记为primary 3、SUBQUERY：在select 或 where列表中包含了子查询 4、DERIVED：在from列表中包含的子查询被标记为derived（衍生），mysql或递归执行这些子查询，把结果放在零时表里 5、UNION：若第二个select出现在union之后，则被标记为union；若union包含在from子句的子查询中，外层select将被标记为derived 6、UNION RESULT：从union表获取结果的select type 访问类型，sql查询优化中一个很重要的指标，结果值从好到坏依次是： system > const > eq_ref > ref > fulltext > ref_or_null > index_merge > unique_subquery > index_subquery > range > index > ALL 一般来说，好的sql查询至少达到range级别，最好能达到ref 1、system：表只有一行记录（等于系统表），这是const类型的特例，平时不会出现，可以忽略不计 2、const：表示通过索引一次就找到了，const用于比较primary key 或者 unique索引。
你会使用 mysql索引吗
经常用在范围内搜索的列上创建索引，因为索引已经排序了，其指定的范围是连续的 索引优缺点 优点 索引由数据库中一列或多列组合而成，其作用是提高对表中数据的查询速度 索引的优点是可以提高检索数据的速度 缺点 索引的缺点是创建和维护索引需要耗费时间 索引可以提高查询速度，会减慢写入速度 索引并不是越多越好，索引固然可以提高相应的 select 的效率，但同时也降低了 insert 及 update 的效率，因为 insert 或 update 时有可能会重建索引，所以怎样建索引需要慎重考虑，视具体情况而定。
Java 8 新特性
冗余的Lambda场景 来看一个简单的函数式接口以应用Lambda表达式： Lambda表达式的目的，打印参数传递的字符串把参数str，传递给了System.out对象，调用out对象中的方法println对字符串进行了输出 注意： System.out对象是已经存在的 println方法也是已经存在的 所以我们可以使用方法引用来优化Lambda表达式可以使用System.out方法直接引用（调用）printin方法 请注意其中的双冒号::写法，这被称为“方法引用”，而双冒号是一种新的语法。
多线程基础篇
注：一般推荐采用实现接口的方式来创建多线程 线程的生命周期 线程安全问题 产生原因： 多个线程在操作共享的数据 操作共享数据的线程代码有多条 当一个线程在操作共享数据的多条代码过程中，其他线程参与了运算，就会导致线程安全问题 解决线程安全问题的思路： 就是将多条操作共享数据的代码封装起来，当线程 在执行这些代码的时候，必须要当前线程把这些代码都执行完毕后，其他线程才可以参与运算 在Java中，用同步代码块就可以解决这个问题 同步代码块的格式： 同步的好处： 解决了线程安全问题 弊端： 相对降低了效率，因为同步外的线程都会判断同步锁，消耗资源 同步的前提： 同步中必须有多个线程并使用同一个锁 案例分析： 分析上面代码是否存在线程安全问题，从产生线程安全问题的原因分析： 首先需要判断是否存在共享数据 操作共享数据的线程代码是否有多条 对于上面的代码Bank被线程任务执行 所以会产生线程安全问题，解决办法：加锁 同步代码块 同步函数（同步函数用的锁时this对象） 同步函数和同步代码块的区别： 同步函数的锁是固定的this,也就是当前的对象 同步代码块使用的锁是任意对象 建议使用同步代码块 静态同步函数的锁： 还是以上的实例，这样也是可以的，这说明静态同步函数的锁绝对不是this,因为静态函数根本就没有this，那锁是什么呢？
Redis 详解指南
9.Redis的复制（Master和Slave） 备机与主机使用slaveof ip 端口建立连接后备机会将主机的所有数据备份到备机 主从复制，读写分离：只有主机可以写，从机只能读，如果从机使用写命令会报错 如果主机挂了，备机依然是备机，不会夺位，除非手动操作 如果主机修复了，备机依然会继续备份无需任何操作 如果某台备机挂了，修复后启动redis会变成master，需要与主机重新连接才可以继续备份slaveof ip 端口 上一个Slave可以是下一个slave的Master，Slave同样可以接收其他slaves的连接和同步请求，那么该slave作为了链条中下一个的master，可以有效减轻master的写压力 中途变更转向：会清除之前的数据，重新建立，拷贝最新的 SLAVEOF no one可以使当前数据库停止与其他数据库的同步，转成主数据库 复制的原理 Slave启动成功连接到master后会发送一个sync命令 Master接到命令启动后台的存盘进程，同时收集所有接收到的用于修改数据集命令， 在后台进程执行完毕之后，master将传送整个数据文件到slave，以完成一次完全同步 全量复制：而slave服务在接收到数据库文件数据后，将其存盘并加载到内存中。
Vue 学习之九Vue计算属性与webpack
文章已迁移到新地址，访问 https://guqing.xyz/archives/how-to-use-vue2
Vue 学习笔记之八获取组件对象和使用 vue-router
8 获取dom对象和组件的对象 ref 被用来给元素或子组件注册引用信息。 如果在普通的 DOM 元素上使用，引用指向的就是 DOM 元素；如果用在子组件上，引用就指向组件实例： 关于 ref 注册时间的重要说明：因为 ref 本身是作为渲染结果被创建的，在初始渲染的时候你不能访问它们 - 它们还不存在！ 包含的功能有： 嵌套的路由/视图表 模块化的、基于组件的路由配置 路由参数、查询、通配符 基于 Vue.js 过渡系统的视图过渡效果 细粒度的导航控制 带有自动激活的 CSS class 的链接 HTML5 历史模式或 hash 模式，在 IE9 中自动降级 自定义的滚动条行为 9.1 路由写法和传参 引入vuejs和vue-router 9.2 嵌套路由