官网传送门
初识 Nodejstip Node.js®Node.js® is a JavaScript runtime built on Chrome’s V8 JavaScript engine
Node.js® 是一个基于 Chrome V8 引擎 的 JavaScript 运行时环境
基于 Express 框架,可以快速构建 Web 应用
基于 Electron 框架,可以构建跨平台的桌面应用
基于 restify 框架,可以快速构建 API 接口项目
读写和操作数据库、创建实用的命令行工具辅助前端开发、etc…
Buffer 缓冲区
Buffer 缓冲区文档
Buffer 的结构与数组类似,操作方法也与数组类似
数组不能存储二进制文件,Buffer 是专门存储二进制数据的
Buffer 存储的是二进制数据,显示时以 16 进制的形式显示
Buffer 每一个元素范围是 00ff,即 0255、00000000~11111111
每一个元素占用一个字节内存
Buffer 是对底层内存的直接操作,因此大小一旦确定就不能修改
Buffer 常用方法:
Buffer.fro ...
在小程序开发中,var that =this的声明很常见。举个例子,代码如下!示例代码1
12345678910111213141516171819202122//index.js Page({ data: { toastHidden: true, }, loadData: function () { var that = this//这里声明了that;将this存在that里面 wx.request({ url: 'test.php', data: {a: 'a', b: 'b'}, header: { 'content-type': 'application/json' }, success(res) { that.setData({ toastHidden: fa ...
微信小程序更新数组数据,页面展示未刷新问题在微信小程序中,数组 arraylist 里面有八个元素(每个元素是对象);使用this.setData({}) 想向该数组里面添加或者修改一个元素;更改元素后数组 arraylist 是改变了,但是页面没有重新渲染,具体原因可能与vue中改变数组页面不渲染的情况类似;
12345678910111213// 获取数组 let arraylist = this.data.arraylist; // 修改数据this.data.arraylist[index].type=res //新建一个数组,在进行setDatavar newArraylist = this.arraylist // 使用setData重新渲染页面,改变视图层this.setData({ leaveWordList: newArraylist})
微信小程序更新数组数据,页面展示未刷新问题在微信小程序中,数组 arraylist 里面有八个元素(每个元素是对象);使用this.setData({}) 想向该数组里面添加或者修改一个元素;更改元素后数组 arraylist 是改变了,但是页面没有重新渲染,具体原因可能与vue中改变数组页面不渲染的情况类似;
12345678910111213// 获取数组 let arraylist = this.data.arraylist; // 修改数据this.data.arraylist[index].type=res //新建一个数组,在进行setDatavar newArraylist = this.arraylist // 使用setData重新渲染页面,改变视图层this.setData({ leaveWordList: newArraylist})
前端开发
未读axios介绍与使用说明 axios中文文档本周在做一个使用vuejs的前端项目,访问后端服务使用axios库,这里对照官方文档,简单记录下,也方便大家参考。
Axios 是一个基于 Promise 的 HTTP 库,可以用在浏览器和 node.js 中。github开源地址https://github.com/axios/axios
特性
在浏览器中创建 XMLHttpRequests
在 node.js 则创建 http 请求
支持 Promise API
支持拦截请求和响应
转换请求和响应数据
取消请求
自动转换 JSON 数据
客户端支持防御 XSRF
浏览器支持支持Chrome、火狐、Edge、IE8+等浏览器
安装使用 npm安装:
1$ npm install axios
使用 bower:
1$ bower install axios
或者直接使用 cdn:
1<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
使用举例执行 G ...
前端开发
未读vue组件间通信组件是 vue.js 最强大的功能之一,而组件实例的作用域是相互独立的,这就意味着不同组件之间的数据无法相互引用。如何传递数据也成了组件的重要知识点之一。
组件组件与组件之间,还存在着不同的关系。父子关系与兄弟关系(不是父子的都暂称为兄弟吧)。
父子组件父子关系即是组件 A 在它的模板中使用了组件 B,那么组件 A 就是父组件,组件 B 就是子组件。
12345678910111213// 注册一个子组件Vue.component('child', { data: function(){ return { text: '我是father的子组件!' } }, template: '<span>{{ text }}</span>'})// 注册一个父组件Vue.component('father', ...
账户配置
配置全局账户,对所有 Git 仓库有效
12git config --global user.name 'Your Name'git config --global user.email 'Your Email'
配置局部账户,只对当前 Git 仓库有效
12git config --local user.name 'Your Name'git config --local user.email 'Your Email'
查看全局配置
1git config --global --list
查看局部配置
1git config --local --list
生成ssh 密钥连接到github仓库,公钥文件存放在C:/用户文件夹/.ssh/id_rsa.pub
12ssh-keygen -t rsa -C "你的邮箱"ssh -T git@github.com //测试连接命令
本地基本操作初始化本地库1git init
...
Vue3官网传送门
Vue3 的变化性能的提升
打包大小减少 41%
初次渲染快 55%, 更新渲染快 133%
内存减少 54%
源码的升级
使用 Proxy 代替 defineProperty 实现响应式
重写虚拟 DOM 的实现和 Tree-Shaking
拥抱 TypeScript
Vue3 可以更好的支持 TypeScript
新的特性
Composition API(组合 API)
setup 配置
ref 与 reactive
watch 与 watchEffect
provide 与 inject
……
新的内置组件
Fragment
Teleport
Suspense
其他改变
新的生命周期钩子
data 选项应始终被声明为一个函数
移除 keyCode 支持作为 v-on 的修饰符
……
创建 Vue3 工程vite 和 vue-cli 对比
vite
vue-cli
支持的 vue 版本
仅支持 vue3.x
支持 2.x 和 3.x
是否基于 webpack
否
是
运行速度
快
较慢
功能完整度
小而 ...
前端开发
未读官网传送门
路由何为路由
一组路由即一组映射关系(key-value)
key 为路径,value 可能是 function 或 component
前端路由前端路由即地址和组件之间的对应关系(以下已哈希模式为例)。
前端路由简易工作方式:
用户点击了页面上的路由链接
URL 地址的 Hash 值发生变化
前端路由监听到 Hash 值的变化
前端路由渲染 Hash 地址对应的组件
实现简易的前端路由:
1234567<!-- a 链接添加对应 Hash 值 --><a href="#/home">Home</a><a href="#/movie">Movie</a><a href="#/about">About</a><!-- 动态渲染组件 --><component :is="compName"></component>
12345678910111213141516171819 ...
官网传送门
概述何为 Vuex ?
Vuex 专门在 Vue 中实现集中式状态(数据)管理的一个 Vue 插件,对 Vue 应用中多个组件的共享状态进行集中式的管理,也是一种组件间通信的方式,适用于任意组件间通信
何时用 Vuex ?
多个组件依赖于同一状态
来自不同组件的行为需要变更同一状态
Vuex 工作原理图:
官方 Vuex 项目结构示例:
123456789101112131415.├── index.html├── main.js├── api│ └── ... # 抽取出API请求├── components│ ├── App.vue│ └── ...└── store ├── index.js # 组装模块并导出 store 的地方 ├── actions.js # 根级别的 action ├── mutations.js # 根级别的 mutation └── modules ├── cart.js # 购物车模块 └── products.js ...