git的使用、router和route的区别以及v-show和v-if的差别

多人协作使用git的步骤（使用gitub）

建立自己的空仓库

1. 远程建立：在gitub上
2. 本地建立：直接在自己的项目上建立（指令：git init my-project、cd my-project）

连接远程仓库

git remote add origin https://github.com/yourusername/my-project.git

这里使用HTTPS速度过慢无法连接、所以使用SSH密钥

使伙伴可以使用仓库

可以通过克隆远程仓库来获取项目的副本

git clone https://github.com/yourusername/my-project.git

邀请协同者：为了使他有权利对你的仓库及进行更改

将代码拉入空仓库

进行git指令的学习

1. 每次写代码前需要先拉去最新的代码

git pull origin master

2. 添加更改

git add .

3. 提交更改

git commit -m "描述你的更改"

4. 在推送之前拉取更新

git pull origin master

5. 没有冲突就可以推送代码了

git push origin master

6. 有冲突手动解决冲突

router和route的区别

router

定义：

router 是 Vue Router 的实例，负责整个路由的配置和管理。它包含了所有的路由规则和全局导航守卫等。

用途：

1. 用于定义应用的路由规则。
2. 提供全局的路由导航功能，如路由跳转、路由守卫等。
3. 可以通过 router 实例调用各种方法，如 router.push()、router.replace() 等来进行程序化导航。

route

定义：

route 是一个表示当前路由状态的对象。它包含了有关当前路由的信息，如路径、参数、查询字符串等。

用途：

1. 在组件中访问当前路由的信息。
2. 可以用于获取当前路由的参数、查询字符串等，以便根据这些信息渲染组件。

v-show和v-if的差别

渲染方式

v-if

1. DOM 操作：v-if 会根据条件的真假来决定是否渲染 DOM 元素。如果条件为 false，元素将从 DOM 中完全移除；当条件为 true 时，该元素会被插入到 DOM 中。
2. 开销：每次条件变化时，Vue 会执行插入或删除操作，因此使用 v-if 在频繁切换时可能会带来性能开销。

v-show

1. DOM 操作：v-show 始终渲染元素，但通过设置 CSS 的 display 属性来控制元素的可见性。当条件为 false 时，该元素的 display 属性被设置为 none，但仍然存在于 DOM 中。
2. 开销：切换 v-show 的可见性只涉及修改样式，因此在频繁切换时性能更优。

初始化渲染

v-if：

只有在条件为 true 时，元素才会被渲染。因此在初始渲染时，v-if 可以减少 DOM 元素的数量。

v-show：

在初始渲染时，所有绑定了 v-show 的元素都会被渲染，即使它们是隐藏的。

内存使用

v-if：

当条件为 false 时，元素被从 DOM 中移除，内存使用较低。

v-show：

元素始终存在于 DOM 中，即使不可见，因此可能会导致较高的内存占用。

状态保持

v-if：

移除元素后，所有与该元素相关的状态（如输入框的值）都会丢失。

v-show：

元素在隐藏时仍然保留其状态，适用于需要保持状态的场景。

使用场景

v-if：

适合于不常变化的条件。
适用于需要动态控制大量数据的场景，特别是当你希望减少初始渲染的 DOM 元素数量时。

v-show：

适合于频繁切换的元素（如选项卡、下拉菜单等）。
适用于需要快速显示和隐藏的 UI 组件，保持元素的状态。