- 博客(75)
- 收藏
- 关注
RSS订阅原创 vim 的一些概念
This is a markdown to learn noun of vim理解vim 的一些名词对学习vim是很有必要的缓冲区(Buffer) 窗口(Window) 标签(Tab) 标记(Tab) 寄存器(Register) 插件(Plugin) vim脚本(VimScript)vim缓冲区什么是vim缓冲区 我们打开多个文件的时候比如vim test1 test2 test3 但是这个 但是这个界面只会展示test1 的相关内容 但是vim其实是把这三个文件全部都缓存起来了，只是在页面上
2021-12-28 16:35:28
325
原创 关于vim常用操作
this is a markdown File to learn basical knowledge of vim如果改变了文本需要对文本进行保存:w就行，不然就无法退出文件进行其他操作对vim 进行分屏操作，在打开文件的时候 vim -on （默认上下分屏） file1name file2name vim -On (左右分屏) filename1 file2name 在打开文件之后进行分屏操作
2021-12-28 16:34:13
558
原创 Vue_02基础深入Vue
Vue基础 - 事件处理与响应式数据监听1、模板与渲染每一个独立的组件模板有且仅有一个顶层父级元素。因为组件挂载的时候是使用解析生成的结构替换掉挂载点的元素，所以挂载点不推荐使用 html 和 body 这两个元素，所以我们通常会指定 body 中的一个空白元素作为整个应用的顶层组件容器。1-1、el 选项根组件可以指定 el 选项来绑定挂载点。自动调用 $mount。指定 el 同时又没有指定 template ，则把 el 的 outerHTML 作为 template。1-2
2021-12-28 16:30:01
217
原创 Vue 动态路由
文章目录动态路由路由对象$router 对象$route 对象$route.paramsrouter-link动态路由有的时候，我们需要把满足某种规则的路由全部匹配到同一个组件，比如不同的商品的 url/item/1/item/2/item/3...我们不可能为每一个商品都定义一个独立的组件，而是把它们都映射到同一个组件，同时 url 后面的部分为动态变化的部分，我们会在设计路由的时候进行特殊的处理...{ path: '/item/:itemId', name: 'item',
2021-12-28 16:29:22
2080
原创 Ts_02类型系统
TS_02 初识类型系统什么是类型程序=数据结构+算法=各种格式的数据+处理数据的逻辑数据是有格式（类型） 的数字、布尔值、字符数组、集合程序是可能有错误的计算错误(对非数字类型数据进行一些数学运算)调用一个不存在的方法不同类型的数据有不同的操作方式或方法，如:字符串类型的数据就不应该直接参与数学运算动态类型语言 & 静态类型语言动态类型语言程序运行期间才做数据类型检查的语言，如:JavaScript静态类型语言程序编译期间做数据类型检查的语言，如:Java静态
2021-12-27 17:16:57
161
原创 我的笔记本安装Arch的历程
Arch Linux的安装1.分区fdisk /dev/sda/ dev/sda1 +512M EFI SYSTEM efi分区/dev/sda2 +12G Linux Swap 交换分区/dev/sda3 剩下所有 Linux root(x86-64) 根分区fdisk /dev/sdb/dev/sdb1 所有 Linux Home1
2021-12-07 11:27:48
353
原创 正则匹配
正则匹配文章目录正则匹配我们为什么要学习正则匹配正则的两种创建方法字面量创建通过RegExp创建可以使用正则的一些常用方法正则对象下面的方法字符串方法元字符（有特殊含义的的非字母字符）字符相关的元字符数量相关的元字符位置相关的元字符括号相关匹配模式命名分组以及零宽断言我们为什么要学习正则匹配//需求：我们需要提取字符串里面的连续数字，然后返回一个数组//如果使用自定义函数的方式let getNumber = (str) => { let temp = ""; let
2021-04-23 14:07:40
325
1
原创 Ts_09装饰器
装饰器文章目录装饰器学习目标什么是装饰器装饰器语法装饰器类装饰器方法装饰器属性装饰器访问器装饰器参数装饰器装饰器执行顺序装饰器工厂元数据什么是元数据？使用 `reflect-metadata`定义元数据使用元数据的 log 装饰器使用 `emitDecoratorMetadata`学习目标了解装饰器语法，学会使用装饰器对类进行扩展清楚装饰器执行顺序了解元数据以及针对装饰器的元数据编程什么是装饰器装饰器-Decorators 在 TypeScript 中是一种可以在不修改类代码的基础上通过添
2021-04-23 14:05:12
91
原创 Ts_08模块系统和命名空间
模块系统和命名空间文章目录模块系统和命名空间模块系统模块化模块化历程基于服务端、桌面端的模块化CommonJS基于浏览器的模块化AMDrequireJS`requireJS` 的 `CommonJS` 风格UMD模块化的大同世界ESM独立模块作用域导出模块内部数据导入外部模块数据TypeScript 中的模块化Ts中的模块系统模块全局模块文件模块模块语法导出模块内部数据导入外部模块数据模块编译`module` 选项模块导出默认值的问题加载非 `TS` 文件非 `ESM` 模块中的默认值问题以模块的方式加载
2021-04-23 14:04:38
257
原创 Ts_07泛型
泛型的使用场景和具体使用方法文章目录泛型的使用场景和具体使用方法泛型函数泛型类泛型接口为什么要使用泛型如下情况(我们不知道对象的类型也，这样我们无法定义obj的类型也无法知道k的类型)泛型函数function getVal(obj,k){return obj[k];}这个时候我们就可以使用到了泛型，我们可以定义一个泛型参数在调用函数的时候传入泛型参数就可以了function getVal<T>(obj:T,k:keyof T){return obj[T]}//调用的时候
2021-04-23 14:04:08
156
原创 Ts_06类型系统深入(类型操作)
Ts_06 类型系统深入类型保护我们通常在 JavaScript 中通过判断来处理一些逻辑，在 TypeScript 中这种条件语句块还有另外一 个特性:根据判断逻辑的结果，缩小类型范围(有点类似断言)，这种特性称为 类型保护 ，触发条 件:逻辑条件语句块:if、else、elseif特定的一些关键字:typeof、instanceof、in…typeof我们知道 typeof 可以返回某个数据的类型，在 TypeScript 在 if 、 else 代码块中能够把 typeof 识别为类型
2021-04-23 14:03:36
104
原创 Ts_05类的标注
Ts面向对象编程思想类类的概念面向对象编程中一个重要的核心就是: 类 ，当我们使用面向对象的方式进行编程的时候，通常会首先 去分析具体要实现的功能，把特性相似的抽象成一个一个的类，然后通过这些类实例化出来的具体对象 来完成具体业务需求类的基础在类的基础中，包含下面几个核心的知识点，也是 TypeScript 与 EMCAScript2015+ 在类方面共有 的一些特性class 关键字构造函数constructor成员属性定义成员方法this关键字除了以上的共同特性以外，在 Typ
2021-04-23 14:03:03
303
原创 Ts_04函数详解
函数详解函数的标注一个函数的标注包括函数参数的标注以及函数返回值的标注function fn(a:string):string{};// 直接标注let fn:(a:string)=>string=function(a){} //声明式标注type callback=(a:string):string; //类型别名方式标注interface ICallBack{ //接口方式标注(a:string):string;}let fn:callback=function(a)
2021-04-23 14:02:30
151
原创 Ts_03接口和高级类型
接口和高级类型接口接口定义TypeScript 的核心之一就是对值(数据)所具有的结构进行类型检查，除了基本标注，针对对象类型的数据，还可以通过 Interface (接口)，来进行标注。接口:对复杂的对象类型进行标注的一种方式，或者给其它代码定义一种契约(比如:类)接口的基础语法定义结构特别简单interface Point { x: number;y: number; }上面的代码定义了一个类型，该类型包含两个属性，一个 number 类型的 x 和一个 number 类型的
2021-04-23 14:01:56
544
原创 Ts_01基本的环境搭建
Ts_01 环境的搭建与编译执行环境搭建TypeScript 编写的程序并不能直接通过浏览器运行，我们需要先通过 TypeScript 编译器把 TypeScript 代码编译成 JavaScript 代码TypeScript 的编译器是基于 Node.js 的，所以我们需要先安装 Node.jsyarn global add npm node -v #查看当前的node版本安装TypeScript的编译器npm install -g typescript #通过npm安装y
2021-04-23 14:00:47
124
原创 react_06-react_redux相关
reduxRedux 是一个独立的 JavaScript 状态管理库https://www.redux.org.cn/安装 Reduxnpm i reduxyarn add redux核心概念理解 Redux 核心几个概念与它们之间的关系state 状态reducer 纯函数store 仓库action 动作state 对象通常我们会把应用中的数据存储到一个对象树（Object Tree） 中进行统一管理，我们把这个对象树称为：statestate 是只读的这里需要注
2020-09-30 10:14:38
162
原创 react_05 路由相关以及综合实践
路由相关以及综合实践render 和重定向import React, { Fragment, useState } from "react"import { Redirect, Route,Switch } from "react-router-dom"import IndexView from "./view/indexView"import JoinView from "./view/joinView"import Page404 from "./view/page404"import P
2020-09-23 10:26:20
111
原创 React_04 useEffect实现类组件的生命周期和自定义Hooks以及react-router入门
hooks && Router本节课重点内容函数式组件函数式组件，本质就是一个常规函数，接收一个参数 props 并返回一个 reactElement函数式组件中没有this和生命周期函数,不能使用 string ref使用函数式组件时，应该尽量减少在函数中声明子函数，否则，组件每次更新时都会重新创建这个函数React hooks(钩子)React hooks 是React 16.8中的新增功能。它们使您无需编写类即可使用状态和其他React功能常用 hookuseS
2020-09-21 14:00:24
1270
原创 React_03 react 一些零碎的API
文章目录key 的问题PureComponentrefchildrendangerouslySetInnerHTMLkey 的问题在 React ，组件每次更新时，会生成一个 虚拟DOM，和原有的虚拟DOM进行对比。如果是批量生成的一组元素，那React就会根据 key 值去做对比一个列表中的每一项 key 是唯一的如果列表中发生顺序等操作变化，key 一定要用数据的idPureComponentPureComponent 提供了一个具有浅比较的 shouldComponentUpdate 方
2020-09-20 16:31:44
90
原创 React_02 组件的生命周期以及组件间通信
state 和 setStatesetState(updater, [callback])updater: 更新数据，里面的才参数可以是对象，也可以是函数，但是函数必须返回一个对象，对象里面的是需要修改的属性的值callback: 更新成功后的回调 function异步:react通常会集齐一批需要更新的组件，然后一次性更新来保证渲染的性能浅合并 Objecr.assign()调用 setState 之后，会触发生命周期，重新渲染组件示例： import React, { Componen
2020-09-19 13:31:10
209
原创 利用React 和ant-design 搭建cnode项目的随笔
文章目录利用React 和ant-design 搭建cnode项目的随笔利用create-react-app搭建一个React项目利用React 和ant-design 搭建cnode项目的随笔利用create-react-app搭建一个React项目利用npm包管理器创建React项目npm init react-app cnode-hooks进入项目然后删除多余的文件#进入到主要的工作目录cd cnode/src #删除多余的文件这里我为了方便给这个命令定义了一个别名（rmR
2020-09-16 17:54:31
148
原创 git 连接到远程的github
创建github账号首先你需要一个github的账号，我已经有了，申请也很简单，就不再赘诉安装本地的git在linux系统下安装gitsudo apt install git查看是否安装成功git --version第一次连接创建一个SSH key 终端输入：ssh-keygen -t rsa -C "1041370212@qq.com"然后直接一路enter到底这时候你会发现在你的～目录下会多了一个 .ssh文件然后与github建立连接建立连接的几种方法方法一
2020-09-15 21:41:23
292
原创 uni-app快速入门
文章目录uni-app简介uni-app优势快速入门uni-app简介uni-app 是一个使用 Vue.js 开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、H5、以及各种小程序（微信/支付宝/百度/头条/QQ/钉钉/淘宝）、快应用等多个平台。uni-app 诞生的背景：多端泛滥体验不好生态不丰富uni-app优势跨平台更多：一套代码多端使用，能优雅的在一个项目里调用不同平台的特色功能。运行体验更好：组件、api 与微信小程序一致，兼容weex 原生渲
2020-09-04 17:42:29
333
原创 微信开发者工具
文章目录微信开发者工具存在的原因微信开发者工具底层框架代码编译模拟器微信开发者工具存在的原因微信开发者工具存在的原因肯定是因为当时其它开发者工具写不了微信小程序。因为小程序渲染层和逻辑层分离，webstorm 之类的网页开发工具是写不了写小程序的，必须使用微信开发者工具。微信开发者工具是小程序开发生态一站式IDE，其功能有：代码开发、编译运行、界面和逻辑调试、真机预览、发布版本等。微信开发者工具底层框架底层模块：基于nw.js ，使用node.js、chromium以及系统API来实现用户交互
2020-09-04 17:21:21
5900
原创 小程序基础库的更新迭代
文章目录小程序的基础库基础库的版本号版本号大小的判断方法异常基础库的更新微信客户端和小程序基础库的迭代更新小程序的基础库小程序的组件、API其实都属于小程序基础库。基础库的职责是处理数据绑定、组件系统、事件系统、通信系统等一系列框架逻辑，让整个小程序有序的运作起来。小程序的基础库是JavaScript编写的，它可以被注入到渲染层和逻辑层运行。渲染层注入的基础库叫做WebView基础库。逻辑层注入的基础库叫做AppService基础库。小程序的基础库是内置在微信客户端里的，这样做的好处有两
2020-09-04 17:15:51
1965
原创 微信小程序的性能优化
文章目录小程序的启动分包加载小程序代码包的大小限制常规的控制代码包大小的方法页面和Page 构造器的运行逻辑页面层级数据通信js中提高数据更新速度的方法js中提升数据更新性能wxml 中提高数据更新速度的方法兼容性当前手机的信息版本兼容小程序的启动在小程序启动时，微信会为小程序展示一个固定的启动界面，界面内包含小程序的图标、名称和加载提示图标。分包加载采用分包时，小程序的代码包有两种：一个“主包”，包含小程序启动时会马上打开的页面代码和相关资源。多个“分包”，包含其余的代码和资源。这样
2020-09-04 16:55:52
1868
原创 微信底层框架
文章目录技术选型Hybrid 技术小程序可以写JavaScript 的原因webviewwxml 文件里问什么不直接写原生的html 标签原生组件技术选型Hybrid 技术小程序的架构要求：快！加载快、渲染快……渲染界面的技术：Hybrid 技术，介于原生技术和web 技术之间。若使用纯客户端原生技术，小程序代码需要与微信代码一起编包，跟随微信发版，这种开发节奏必然是不对的。所以小程序像Web 技术那样，有一份随时可更新的资源包放在云端，通过下载到本地，动态执行后即可渲染出界面。若使用纯 We
2020-09-04 16:37:07
1429
原创 微信小程序协同工作和发布
文章目录协同工作人员组织结构和权限分配小程序的版本版本管理用户体验如何打造优秀的小程序小程序体验的评估原则提高用户体验的建议发布发布前常常遗漏的点发布模式小程序码协同工作大型公司，分工很细，一个项目要多人协作。因此，微信平台提供了权限管理，让整个团队更好的协同工作。在开发者完成开发之后，就可以开发者工具提交小程序的代码包，然后在小程序管理平台发布小程序。这样，用户就可以通过搜索、扫码等方式进入小程序。人员组织结构和权限分配项目管理人员：负责统筹整个项目的进展和风险、把控小程序对外发布的节奏
2020-09-04 16:28:27
2463
原创 微信云开发
文章目录什么是云开发建立云开发项目开通云服务体验小程序查看控制台云开发能力云调用云存储数据库资源环境配额什么是云开发云开发就是在开发微信小程序、小游戏，无需搭建服务器，使用微信云平台的API 进行核心业务开发，从而实现快速上线和迭代。云开发的四大基础功能：云函数 ：无需自建服务器。在云端运行的代码，微信私有协议天然鉴权，开发者只需编写自身业务逻辑代码。数据库 ：无需自建数据库。一个既可在小程序前端操作，也能在云函数中读写的 JSON 数据库。云存储：无需自建存储和 CDN。在小程序前端直接上传
2020-09-04 15:37:50
10227
原创 微信小程序的应用场景
开发流程在开发前，首先要有原型图和UI视觉图。原型图通常是由产品经理使用Axure 绘制，原型图会用简单的图形和文字展示页面功能，比如页面元素的布局和交互逻辑。UI视觉图就是基于原型图的页面布局出的最终视觉效果图。当然，若页面不复杂，原型图和UI 视觉图也可能都画在一起。我们开发者要做的，就是基于UI的视觉效果和原型图的交互逻辑开发小程序。我们可以按照以下三步走：WXML+WXSS还原设计稿。按照页面交互，梳理出每个页面的data部分，填充WXML的模板语法。完成JS逻辑部分。注意：
2020-09-04 15:04:24
1314
原创 微信的宿主环境
文章目录前言渲染层和逻辑层双线程下的界面渲染原理App页面文件构成和路径页面构造器Page()页面的生命周期页面的用户行为页面数据的注意事项页面跳转组件自定义组件父子组件的数据传递apiAPI的常见规律事件用户在渲染层的行为反馈事件事件捕捉和事件冒泡示例：测试事件冒泡和事件捕捉的差异前言宿主环境是微信客户端给小程序提供的一种环境 。宿主指的就是微信客户端，也就是官方API里的wx 对象。宿主环境的作用是什么？宿主环境会把我们写的各种文件整合到一起，进行解析，然后在微信APP 里显示出我们所看到的样
2020-09-02 17:17:30
295
原创 微信开发的代码组成
文章目录JSON 配置JSON 是什么JSON 语法wxml摸版数据绑定{{ }}语法逻辑WXML中的条件循环列表渲染列表渲染 – 唯一标志符摸版共同属性wxss样式文件组成wxss和css不一样的地方选择器选择器的优先级扩展：WeUI.wxssjavascript脚本作用域模块化JSON 配置JSON 是什么JSON 是一种数据格式，并不是编程语言，在小程序中，JSON扮演的静态配置的角色。常见的json 配置文件有3种：小程序配置 app.json：做全局配置页面配置 page.jso
2020-09-02 16:50:05
1721
原创 微信开发，微信开发者平台
微信小程序小程序介绍微信小程序是一种全新的连接用户端与服务端的方式。小程序可以在微信内被便捷地获取和传播。小程序具有出色的用户体验。###为什么要学习小程序微信小程序开发成本低、使用方便、用户量大、营销便捷。微信小程序简单易学、薪资可观，可以提高自己的综合实力，为工作加分 。小程序和普通网页的区别线程网页开发是单线程的，js线程和渲染线程是互斥的。小程序有一条js逻辑线程和多条渲染线程两种线程。DOM网页开发可以操作DOM。小程序中不能操作DOM。运行环境
2020-09-02 16:24:27
636
原创 echarts 高级应用
文章目录多坐标轴异步数据数据集数据集与图表的映射方式数据集的行列映射数据集的维度映射dimensions 中元素的书写方式数据集的编码映射encode 编码映射的使用方法区域缩放视觉映射多坐标轴多坐标轴的常见应用就是一个图表有两个y 轴。多坐标轴的设置方法：在yAxis 中写入两组数据，让两组数据的行数保持一致在series 中设置数据时，使用 yAxisIndex 属性设置系列与哪个y 轴相关联异步数据数据的更新有两种思路：请求到数据后，setOption()先setOption(
2020-08-27 10:08:47
3041
原创 echarts 快速入门
文章目录echarts 入门浏览器绘图方式echarts官网展示，以及功能介绍快速上手echarts如何学习echartsecharts 常用组件标题 title图例 legend工具栏 toolbox提示框 tooltip坐标轴 xAxis yAxis标记点 markPoint标记线常用图表折线图 line饼图 pie散点图 scatterK 线 candlestick雷达 radar仪表盘 gauge地图 map总结echarts 入门浏览器绘图方式浏览器绘图主要有两种方式canvas ：点阵
2020-08-23 16:24:04
1796
1
原创 cancas_04 canvas合成
文章目录透明度合成 globalAlpha路径裁剪全局合成globalCompositeOperation全局合成的属性值总结透明度合成 globalAlpha什么是globalAlpha？globalAlpha 就是全局对象的透明度，全局对象就是canvas 的上下文对象。使用方法：ctx.globalAlpha=0.6;注意：globalAlpha 要和颜色里的rgba 区别一下。rgba 控制的是某种颜色的透明度；globalAlpha 相当于是让整个画布变透明了路径裁剪什么是路径
2020-08-20 10:30:16
188
原创 canvas-_03 动画相关
动画相关制作动画的基本步骤清理画布：ctx.clearRect(0,0,canvas.width,canvas.height)保存 canvas 上下文对象的状态：ctx.save()绘制动画图形：…恢复 canvas 上下文对象的状态：ctx.restore()驱动动画的方法setTimeOut(fn,time) 和setInterval(fn,time)优点：使用方便，动画的时间间隔可以自定义。缺点：隐藏浏览器标签后，会依旧运行，造成资源浪费。与浏览器刷新频率不
2020-08-18 11:24:22
133
原创 carvans——文本以及变换
文本属性文字的属性有三种字体：font水平对齐： textAlign垂直对齐：textBaselinecanvas 里的font 属性和css 的font 属性是一样的，它可以设置文本的粗细、字号、字体等。如：css 设置字体：p{font:bold 18px serif;}canvas 设置字体：ctx.font=‘bold 18px serif’textAlign 水平对齐方式下方文字的x 位置都是一样，都是垂直虚线的x 位置，它们的textAlign 属性各不相
2020-08-15 17:55:19
477
原创 canvas_01
初识canvas广义：h5 新增canvas 2d 绘图功能狭义canvas 是html 标签canvas可以理解为一张画布在一张画布上画图需要笔，在canvas里面定义了一个上下文对象，获取它的方法是canvas.getContext(‘2d’)；需要注意的是使用画笔在canvas 上画画，要考虑三个方面：颜色形状绘图方法canvas 的尺寸不要使用css 设置canvas 的尺寸不能过大canvas 的尺寸尽量控制在4000 以内。canvas 具体极限值因浏览器、平
2020-08-12 11:53:01
117
原创 React_01了解基本的React 渲染原理以及一些注意事项
文章目录React 是什么？命令式编程 和 声明式编程如何使用 React基于浏览器的模式babelJSX插值表达式各种类型内容在插值中的使用输出数据类型列表渲染条件渲染在属性上使用表达式JSX 使用注意事项基于自动化的集成环境模式 - create-react-app - 脚手架介绍安装与使用安装npmyarn使用项目目录结构说明命令脚本npm startnpm run testnpm run build组件类式组件函数式组件props 和 stateprops 与 state 的区别React 中的事件
2020-07-12 16:04:09
148
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人