Barry's Blog

02. 元素渲染元素是构成 React 应用的最小砖块，描述了你在屏幕上想看到的内容。 1const element = <h1>Hello, world</h1>; 与浏览器的 DOM 元素不同，React 元素是创建开销极小的普通对象。React DOM 会负责更新 DOM 来与 React 元素保持一致。 将一个元素渲染为 DOM假设你的 HTML 文件某处有一个 <div>： 1<div id="root"></div> 根节点，React应用只有单一根DOM节点 但一个html页面可以有多个React应用，每个应用对应一个独立根节点。 12const el = <h1>Hello</h1>ReactDOM.render(el, document.getElementById('root')) 更新已渲染的元素React 元素是不可变对象。一旦被创建，你就无法更改它的子元素或者属性。一个元素就像电影的单帧：它代表了某个特定时刻的 UI。...

05. 事件处理与传统HTML绑定事件的区别传统的 HTML： 123<button onclick="activateLasers()"> Activate Lasers</button> 在 React 中略微不同： 1234// 1.事件名为小驼峰； 2.传入函数以大括号包裹函数名形式<button onClick={activateLasers}> Activate Lasers</button> React 事件的命名采用小驼峰式（camelCase），而不是纯小写。 使用 JSX 语法时你需要传入一个函数作为事件处理函数，而不是一个字符串。 阻止默认事件 (合成事件对象)在 React 中，你需要这样阻止默认事件： 123456789101112function ActionLink() { function handleClick(e) { e.preventDefault(); console.log('The link ...

测试文件Test Test 12yarn create vuepress-site [optionalDirectoryName]# OR npx create-vuepress-site [optionalDirectoryName] 1npx create-vuepress-site [optionalDirectoryName] 来源：本文导入自 xugaoyi/vuepress-theme-vdoing 的 docs/01.前端/25.JavaScript文章/1110.三级目录/00.四级文件.md。原作者：xugaoyi。许可证：MIT。

来源：本文导入自 xugaoyi/vuepress-theme-vdoing 的 docs/《Git》学习笔记/10.手册/06.Git命令思维导图.md。原作者：xugaoyi。许可证：MIT。

Git 工具 - 重写历史许多时候，在使用 Git 时，你可能想要修订提交历史。 Git 很棒的一点是它允许你在最后时刻做决定。 你可以在将暂存区内容提交前决定哪些文件进入提交，可以通过 git stash 来决定不与某些内容工作， 也可以重写已经发生的提交就像它们以另一种方式发生的一样。 这可能涉及改变提交的顺序，改变提交中的信息或修改文件，将提交压缩或是拆分， 或完全地移除提交——在将你的工作成果与他人共享之前。 在本节中，你可以学到如何完成这些工作，这样在与他人分享你的工作成果时你的提交历史将如你所愿地展示出来。 Note 在满意之前不要推送你的工作Git 的基本原则之一是，由于克隆中有很多工作是本地的，因此你可以 在本地 随便重写历史记录。 然而一旦推送了你的工作，那就完全是另一回事了，除非你有充分的理由进行更改，否则应该将推送的工作视为最终结果。 简而言之，在对它感到满意并准备与他人分享之前，应当避免推送你的工作。 修改最后一次提交修改你最近一次提交可能是所有修改历史提交的操作中最常见的一个。 对于你的最近一次提交，你往往想做两件事情：简单地修改提交...

rebase分支合并说明以下 v2 是某个需求的开发分支， dev是总的开发分支，v2 是基于dev分支签出的。 当完成v2的开发后，需要把代码合并到dev，我们可以使用rebase进行合并： 12345678910111213141516171819202122232425262728# 首先将 v2 push到远程仓库git add .git commit -m 'xxx'git push origin v2# 切换到 dev 拉取最新代码git checkout devgit pull origin dev# 切换到 v2git checkout v2git rebase dev # 将 v2 的所有[commit] 变基到(应用到) dev# 切换到 devgit checkout devgit merge v2 # 将 dev分支 快进合并 （此时 (HEAD -> dev, v2) [commit] 两个分支指向同一个提交）# 查看 原v2的[commit]记录 是否在dev分支的最前面（变基成功会把v2的提交记录应用到dev分支的最前面）...

Git工具-查看修订版本Git 能够以多种方式来指定单个提交、一组提交、或者一定范围内的提交。 了解它们并不是必需的，但是了解一下总没坏处。 修订版本指的是：提交 单个修订版本你可以通过任意一个提交的 40 个字符的完整 SHA-1 散列值来指定它， 不过还有很多更人性化的方式来做同样的事情。本节将会介绍获取单个提交的多种方法。 简短的 SHA-1Git 十分智能，你只需要提供 SHA-1 的前几个字符就可以获得对应的那次提交， 当然你提供的 SHA-1 字符数量不得少于 4 个，并且没有歧义——也就是说， 当前对象数据库中没有其它对象以这段 SHA-1 开头。 例如，要查看你知道其中添加了某个功能的提交，首先运行 git log 命令来定位该提交： 12345678910111213141516171819$ git logcommit 734713bc047d87bf7eac9674765ae793478c50d3Author: Scott Chacon <schacon@gmail.com>Date: Fri Jan 2 18:32:33 2009 -080...

Git分支的新建与合并-分支操作文档：Git 分支 - 分支的新建与合并 创建分支并切换此时有一个需求需要在新的分支iss53上工作： 1$ git checkout -b iss53 # b表示branch 它是下面两条命令的简写： 12$ git branch iss53$ git checkout iss53 切换分支突然有一个紧急问题要解决，需要在原来的master分支进行修复： 1$ git checkout master 在切换到master之前，需要iss53分支保持好一个干净的状态（修改都已提交）。 注意：切换分支Git 会重置你的工作目录。 checkout 中文含义 “检出”，checkout <branch> 检出分支 => 检出指定分支的代码 => 重置工作目录并切换分支。 接下来，你要修复这个紧急问题。 建立一个 hotfix 分支，在该分支上工作直到问题解决： 123456$ git checkout -b hotfix# 中间过程在hotfix上修改了代码并提交$ echo 'te...

TypeScript 学习笔记TypeScript 的类型校验是给程序员看的，在编译后不会存在TS代码。 类型注解123456function fn(person: string):void{ // 参数类型是字符串，没有返回值 ///...}fn('str') // 如传递参数非字符串，vscode编辑器中或在编译时将给出错误提示const test:number = 1 有哪些基础类型注解？12345678910111213141516171819// 基础类型:string:number:boolean:null // 只能是null值:undefined // 只能是undefined值:symbol// 引用类型:object // 不常用，多使用接口来给对象进行类型注解// 其他:any // 任意类型:void // 空，用于函数的无返回值的注解:never // 用于标注函数代码永远执行不完（如抛出错误的函数，死循环函数） 什么是类型注解和类型推断、类型断言？类型注解 是显式的标注类型 类型推断 是编辑器...

Flex 布局教程：语法篇http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html CSS Grid 网格布局教程http://www.ruanyifeng.com/blog/2019/03/grid-layout-tutorial.html 只要一行代码，实现五种 CSS 经典布局http://www.ruanyifeng.com/blog/2020/08/five-css-layouts-in-one-line.html 空间居中布局 不管容器的大小，项目总是占据中心点 并列式布局 多个项目并列，如果宽度不够，放不下的项目就自动折行 两栏式布局 一个边栏，一个主栏。边栏始终存在，主栏根据设备宽度，变宽或者变窄 三明治布局 页面在垂直方向上，分成三部分：页眉、内容区、页脚。 圣杯布局 最常用的布局，所以被比喻为圣杯。它将页面分成五个部分，除了页眉和页脚，内容区分成左边栏、主栏、右边栏。 来源：本文导入自 xugaoyi/vuepress-theme-vdoing 的 docs/02.页...