Element-Ui 创建使用2021.8.4 Element 创建使用创建过程中 code . ：启动并自动打开文件

1. 创建过程中 `code .` ：启动并自动打开文件夹

2. S(save)生产依赖D开发依赖（development）开发上线不会被使用,生产依赖会使用

3. 如何局部选中：先选一点代码然后拉到最后面按shift

4. col列 l一整个竖条,一列 row一行

5. 表格布局时有一列的宽不固定因为客户浏览器不一定多宽,设置自适应的话客户端效果更好

6. 属性与插槽

7. 关于if的一个小升级

8 . 快捷键：Alt + 上下键可将选中的行向上向下拉

1.# vue项目中路径使用的@和~的区别

@ 使用说明
@这是webpack设置的路径别名。
在build/webpack.base.conf这个文件里面定义。
~ 使用说明
~ 是 stylus-loader 的东西
~是相对于其他路径（文件）的，类似于相对路径

2.Vscode 用ctrl+F/ H替换；

3.try catch(err) 一定记得写（err）

try{

}catch(err){

          }
复制代码

4.一定保证数据库的稳定正常

5.对于token的优化处理

-  token是登陆之后后台返回的用于以后身份认证 之后都要用  对于这种数据   要储存在VUEX和本地中  取的时候可以直接从本地取  
-  从哪里对token进行取值赋值呢，从VUEX的actions中   定义api请求 同时记得提交到mutation  在login.vue通过已有的表单数据调用vuex中的action 完成登录保存token
复制代码

1.对async await的理解上的补充

async await可以使异步变为同步执行
async会一直等到await后面的执行完才会走下一步代码把api请求强制变为同步去执行
满足我们的希望顺序

2.路由导航守卫-实现两个跳转限制

目标：

登陆用户不能再次回到login
没有登陆就不能访问除login之外的其它页

3. JS的 .includes()方法用于查找字符串是否包含某项在(是否要去白名单时候用优化代码)

const whiteList = ['/login', '/404'] // 白名单
if (whiteList.includes(to.path))

4.一个进度条插件

NProgress github.com/rstacruz/np…

使用：www.jianshu.com/p/05660041b…

5.学习SVG

www.runoob.com/svg/svg-tut…

6.之前一直的一个误区关于VUEX中mutations和actions的触发和使用

// 初始代码
const store = new Vuex.Store({
  state: {
    count: 1
  },
  mutations: {
    increment (state) {
      // 变更状态
      state.count++
    }
  },
  actions: {
    increment (context) {
      store.commit('increment')
    }
  }
})
复制代码

mutations的触发和使用


使用
1.store.commit('increment', 10)(未开启命名空间)
    
2.可以在组件中使用 `this.$store.commit('xxx')` 提交 mutation  (未开启命名空间)
或者使用 `mapMutations` 辅助函数将组件中的 methods 映射为 `store.commit` 调用
  methods: {
    ...mapMutations(['increment']) 
  }
 然后 this.increment()

复制代码

actions的触发和使用

使用
1.store.dispatch('increment',[需要的参数])   (未开启命名空间)
2.可以组件中使用 `this.$store.dispatch('xxx')` 分发 action   (未开启命名空间)
或者使用 `mapActions` 辅助函数将组件的 methods 映射为 `store.dispatch` 调用

  methods: {
    ...mapActions(['increment'])
    
    }
 this.increment([传值])
复制代码

7.本地存储的一个处理

8.活用 getter (对于这个封装,看会就好)

9.hosts文件位置()

作用吧其实没太看懂以后再说吧有一个作用就是把自己不想浏览的网址写进去浏览器就进不去这个地址了先这样吧
C:\Windows\System32\drivers\etc

10.encodeURIComponent() 对特殊字符进行转义

encodeURIComponent() 函数可把字符串作为 URI 组件进行编码
该方法不会对 ASCII 字母和数字进行编码，也不会对这些 ASCII 标点符号进行编码： - _ . ! ~ * ' ( ) 。
decodeURIComponent() 函数可把字符串作为 URI 组件进行解码。

11.VUE route 中的fullPath

fullPath是一个很有用的东西,他能缓存路由跳转后面携带的参数(刷新后依然存在)在PC端用处很大
而path 他是不能缓存路由跳转后面携带的参数所以path只能在两层数据结构的APP移动端起作用
- 说一下原因
- 一般移动端APP只能往里面走,表面和切换的层面是第一层,点击功能按钮进去的是第二层,这种层级关系是具有跳转作用的,所以,你在第一层取到的数据,与第二层来回切换是没有问题的.但是,不能从第一层跳到第三层,跳过去就会丢失数据.

1.关于 `$route` 与 `$router`

router是VueRouter的一个对象，通过Vue.use(VueRouter)和VueRouter构造函数得到一个router的实例对象，这个对象中是一个全局的对象，他包含了所有的路由包含了许多关键的对象和属性。
我们常用的路由跳转
$router.go()
$router.back()
$router.replace()
route是一个跳转的路由对象，每一个路由都会有一个route对象，是一个局部的对象，可以获取对应的name,path,params,query
$route.path 是有一个字符串,相当于当前路由对象的路径
$route.fullPath 路径加查询参数的信息
$route.params 是一个对象,包含路由中的动态片段和全匹配片段的键值对
$route.query 是一个对象 ?return_url='xxx'
$route.router 路由规则所属的路由器
$route.matched 数组,包含当前匹配的路径中所包含的所有片段所对象的匹配参数对象
$route.name 当前路径的名字，如果没有使用的具名路径,则名字为空