vuex
1. Vuex概述
1.1 官方解释
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式
它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化
Vuex 也集成到 Vue 的官方调试工具 devtools extension，提供了诸如零配置的time-travel调试，状态快照导入导出等高级调试功能。
1.2 大白话
状态管理模式、集中式存储管理这些名词听起来就非常高大上，让人捉摸不透。
其实，可以简单的将其看成把需要多个组件共享的变量全部存储在一个对象里面。
然后，将这个对象放在顶层的Vue实例中，让其他组件可以使用。
那么，多个组件是不是就可以共享这个对象中的所有变量属性了呢？
如果是这样的话，为什么官方还要专门出一个插件Vuex呢？难道我们不能自己封装一个对象来管理吗？
当然可以，只是我们要先想想VueJS带给我们最大的便利是什么呢？没错，就是响应式。
如果你自己封装实现一个对象能不能保证它里面所有的属性做到响应式呢？当然也可以，只是自己封装可能稍微麻烦一些。
不用怀疑，Vuex就是为了提供这样一个在多个组件间共享状 ...
vue-router
1. 前端路由的概念
1.1 什么是路由
路由（英文：router）就是对应关系。
1.2 SPA与前端路由
SPA 指的是一个 web 网站只有唯一的一个 HTML 页面，所有组件的展示与切换都在这唯一的一个页面内完成。
此时，不同组件之间的切换需要通过前端路由来实现。
结论：在 SPA 项目中，不同功能之间的切换，要依赖于前端路由来完成！
1.3 什么是前端路由
通俗易懂的概念：Hash 地址与组件之间的对应关系
1.4 前端路由的工作方式
① 用户点击了页面上的路由链接
② 导致了 URL 地址栏中的 Hash 值发生了变化
③ 前端路由监听了到 Hash 地址的变化
④ 前端路由把当前 Hash 地址对应的组件渲染到浏览器中
结论：前端路由，指的是 Hash 地址与组件之间的对应关系！
2. vue-router
vue-router 是 vue.js 官方给出的路由解决方案。它只能结合 vue 项目进行使用，能够轻松的管理 SPA 项目中组件的切换。
vue-router 的官方文档地址：https://router.vuejs.org/zh/
2.1 vue-rout ...
vue动态组件插槽以及自定义指令
1. 动态组件
动态组件指的是动态切换组件的显示与隐藏。
1.1 如何实现动态组件渲染
vue 提供了一个内置的 <component> 组件，专门用来实现动态组件的渲染。示例代码如下：
123456789101112131415161718192021222324252627282930<template> <div id="app"> <!-- 通过is属性，动态指定要渲染的组件 --> <component :is="comName"></component> <!-- 点击按钮，动态切换组件的名称 --> <button @click="comName = 'LeftCom'">展示 Left 组件</button> <button @click="comName = 'RightCom'">展示 Right ...
vue生命周期和数据共享
1. 组件的生命周期
生命周期（Life Cycle）是指一个组件从创建 -> 运行 -> 销毁的整个阶段，强调的是一个时间段。
生命周期函数：是由 vue 框架提供的内置函数，会伴随着组件的生命周期，自动按次序执行。
注意：生命周期强调的是时间段，生命周期函数强调的是时间点。
2. 组件之间的数据共享
2.1 组件之间的关系
在项目开发中，组件之间的最常见的关系分为如下两种：
① 父子关系
② 兄弟关系
2.2 父子组件之间的数据共享
父子组件之间的数据共享又分为：
① 父 -> 子共享数据
② 子 -> 父共享数据
2.3 父组件向子组件共享数据
父组件向子组件共享数据需要使用自定义属性。示例代码如下：
父组件
12345678910111213141516171819202122232425<template> <div id="app"> <TestVue :msg="message" :user="userinfo"></TestVue ...
vue基础入门
1. vue介绍
1.1 什么是vue
官方给出的概念：Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的前端框架。
构建用户界面
用vue往html页面中填充数据，非常的方便
框架
框架是一套现成的解决方案，程序员只能遵守框架的规范，去编写自己的业务功能
要学习vue，就是在学习vue框架中规定的用法
vue的指令、组件（是对UI结构的复用）、路由、Vuex、vue组件库
只有把上面罗列的内容掌握以后，才有才发vue项目的能力
1.2 vue的特性
vue 框架的特性，主要体现在如下两方面：
① 数据驱动视图
② 双向数据绑定
1.2.1 数据驱动视图
在使用了 vue 的页面中，vue 会监听数据的变化，从而自动重新渲染页面的结构。示意图如下：
1.2.2 双向数据绑定
在填写表单时，双向数据绑定可以辅助开发者在不操作 DOM 的前提下，自动把用户填写的内容同步到数据源
中。示意图如下：
1.3 MVVM
MVVM 是 vue 实现数据驱动视图和双向数据绑定的核心原理。MVVM 指的是 Model、View 和 ViewModel，
它 ...
JavaScript基础
了解变量、数据类型、运算符等基础概念，能够实现数据类型的转换，结合四则运算体会如何编程。
体会现实世界中的事物与计算机的关系
理解什么是数据并指导数据的分类
理解变量存储数据的"容器"
掌握常见运算符的使用，了解优先级关系
知道JavaScript数据类型隐式转换的特征
介绍
掌握JavaScript的引入方式，初步认识JavaScript的作用
引入方式
JavaScript程序不能独立运行，它需要被嵌入HTML中，然后浏览器才能执行JavaScript代码。通过script标签将JavaScript代码引入到HTML中，有两种方式：
内部方式
通过scrpt标签包裹JavaScript代码
12345678910111213141516<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" c ...
GRPC
gRPC是Google公司基于Protobuf开发的跨语言的开源RPC框架。gRPC基于HTTP/2协议设计，可以基于一个HTTP/2链接提供多个服务，对于移动设备更加友好。
GRPC技术栈
数据交互格式: protobuf
通信方式: 最底层为TCP或Unix Socket协议，在此之上是HTTP/2协议的实现
核心库: 在HTTP/2协议之上又构建了针对Go语言的gRPC核心库
Stub: 应用程序通过gRPC插件生产的Stub代码和gRPC核心库通信，也可以直接和gRPC核心库通信
gRPC采用protobuf描述 接口和数据, 我们可以把他理解为: protobuf ON HTTP2 的一种RPC
Hello gRPC
下面我们讲演示一个基础的gRPC服务.
protobuf grpc插件
protobuf 不仅可以定义交互的数据结构(message), 还可以定义交互的接口:
123service HelloService { rpc Hello (String) returns (String);}
从Protobuf的角度看，gRPC只不 ...
Protobuf编解码
Protobuf是Protocol Buffers的简称，它是Google公司开发的一种数据描述语言，并于2008年对外开源。Protobuf刚开源时的定位类似于XML、JSON等数据描述语言，通过附带工具生成代码并实现将结构化数据序列化的功能。但是我们更关注的是Protobuf作为接口规范的描述语言，可以作为设计安全的跨语言PRC接口的基础工具
官网
为什么选择Protobuf
一般而言我们需要一种编解码工具会参考:
编解码效率
高压缩比
多语言支持
其中压缩与效率 最被关注的点:
使用流程
首先需要定义我们的数据，通过编译器，来生成不同语言的代码
之前我们的RPC要么使用的Gob, 要么使用的json, 接下来我们将使用probuf
首先创建hello.proto文件，其中包装HelloService服务中用到的字符串类型
12345678syntax = "proto3";package hello;option go_package="pbrpc/pb";message String { string value ...
go语言RPC
概念
RPC是远程过程调用的简称，是分布式系统中不同节点间流行的通信方式。在互联网时代，RPC已经和IPC一样成为一个不可或缺的基础构件。
RPC传输协议
消息序列化与反序列化
下面是一个基于HTTP的 JSON的 RPC:
Go语言RPC
Go语言的标准库也提供了一个简单的RPC实现, 包的路径为net/rpc，也就是放在了net包目录下面。因此我们可以猜测该RPC包是建立在net包基础之上的
由上图可知一个rpc服务由2个部分组成:
server
client
基础的RPC服务
RPC Server
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647package mainimport ( "fmt" "log" "net" "net/rpc")type HelloService struct {}// Hello的逻辑 就是 将对方发送的消息前面添加一 ...
golang命令行
flag
案例
使用阿里云oss实现文件中转站
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283package mainimport ( "flag" "fmt" "os" "github.com/aliyun/aliyun-oss-go-sdk/oss")var ( endpint = "oss-cn-beijing.aliyuncs.com" ak = "xx" sk = "xx" bucketName = "clouds-station" uploadFilePath = "&quo ...