潇寒S_社区达人页

2022年04月

• 04.23 17:42:46
  发表了文章 2022-04-23 17:42:46

  VUE3（十六）封装axios

  axios 基础：从浏览器中创建XMLHttpRequest、从node.js发出http请求、支持Promise API、拦截请求和响应、转换请求和响应数据、取消请求、自动转换JSON数据、客户端支持防止CSRF/XSRF。

  
• 04.23 17:37:04
  发表了文章 2022-04-23 17:37:04

  VUE3（十五）关于cookie使用的几个函数

  下边是我简单封装的几个cookie方法：Utils.ts 、调用。

  
• 04.23 17:34:11
  发表了文章 2022-04-23 17:34:11

  VUE3（十四）使用计算属性computed和监听属性watch

  computed属性，使用 getter 函数，并为从 getter 返回的值返回一个不变的响应式 ref 对象。 watch属性 与 vue2中的 this.$watch (以及相应的 watch 选项) 完全等效。

  
• 04.23 17:26:19
  发表了文章 2022-04-23 17:26:19

  VUE3（十三）main.ts中全局引入axios

  VUE2中可以将我们需要的插件挂载到VUE的主链上（配置成全局属性），然后通过this调用，但是在VUE3的ts中使用这样的配置方法的话是没法通过编译的，这个时候我们就需要拓展属性。

  
• 04.23 17:22:57
  发表了文章 2022-04-23 17:22:57

  VUE3（十二）provide和inject函数

  父传更深的后代 一般往深度层级传递值，有这两种方式： · provide / inject · vuex

  
• 04.23 17:18:42
  发表了文章 2022-04-23 17:18:42

  VUE3（十一）自定义组件子父传值

  在创建项目的时候，官方给出的页面，其实就给出了一个自定义的组件helloworld，里边包含了父传子传值，VUEX的使用，计算属性computed使用，方法的定义以及自定义组件的使用。 计算属性computed和方法的定义，这里使用的并不是VUE3的新语法。 在《VUE3（八）setup与ref函数》这篇中，setup的第二个参数context对象为我们提供了可触发事件emit，我们可以利用emit将子组件中的值传递给父组件。

  
• 04.23 17:11:45
  发表了文章 2022-04-23 17:11:45

  VUE3（十）生命周期及钩子函数

  Vue实例有一个完整的生命周期，也就是从开始创建、初始化数据、编译模板、挂载Dom、渲染→更新→渲染、卸载等一系列过程，我们称这是Vue的生命周期。通俗说就是Vue实例从创建到销毁的过程，就是生命周期。

  
• 04.23 17:03:21
  发表了文章 2022-04-23 17:03:21

  VUE3（九）reactive与toRefs函数

  上一部分中我们说到的ref只是作为单个变量的响应。 Vue3.0中还为我们提供了一个对象式响应的reactive函数 。 Reactive函数创建一个响应式对象。

  
• 04.23 16:58:47
  发表了文章 2022-04-23 16:58:47

  VUE3（八）setup与ref函数

  Setup是VUE3.0中为我们新提供的的组件选项。 创建组件实例，然后初始化props，紧接着就调用setup函数，从生命周期钩子的视角来看，他在beforecreate之前调用。 setup()是函数，具有return，return函数中定义的变量，把其暴露给模板。

  
• 04.23 16:37:06
  发表了文章 2022-04-23 16:37:06

  VUE3（七）vue项目抽离.vue文件中的js、css代码

  平常再做开发的时候，一般情况下不会将html，js，css代码写到一个文件中。 基本上都会写在各自对应的文件中，然后再引入即可。

  
• 04.23 16:33:57
  发表了文章 2022-04-23 16:33:57

  VUE3（六）项目配置使用404页面

  当我们访问的路由没有预先定义的时候，就会跳到一个空白的页面。 这样的体验不太好，那么我们需要配置，访问路由不存在时跳转404页面。 实现这个小功能我用到了vue-router的路由守卫功能。

  
• 04.23 16:30:23
  发表了文章 2022-04-23 16:30:23

  VUE3（五）vue路由vue-router4

  使用vue-router，这里特别说明一下，我这里记录的是vue-router文件的编写。及在页面中的使用。

  
• 04.23 16:26:01
  发表了文章 2022-04-23 16:26:01

  VUE3（四）目录结构

  更好的了解项目的目录结构，能更好的去开发项目： 当前展示的目录结构是基于vite搭建的项目。

  
• 04.23 16:17:54
  发表了文章 2022-04-23 16:17:54

  VUE3（三）项目配置插件支持

  上一篇中我们创建了项目并成功运行。 这里为我的项目添加依赖，我这里使用的是yarn。

  
• 04.23 16:13:21
  发表了文章 2022-04-23 16:13:21

  VUE3（二）使用vue-cli创建一个项目

  VUE3官方推荐使用vite来构建项目，但是并不是说之前使用vue-cli创建项目就不行了。 使用vue-cli创建项目，要确保你的vue-cli的版本要大于4.5.6.

  
• 04.23 15:51:52
  发表了文章 2022-04-23 15:51:52

  VUE3（一）安装+使用vite创建一个项目

  VUE3.0第一篇。主要还是看一看官方的手册，做一个笔记。 官方文档网址： www.vue3js.cn/docs/zh/gui… 这里看一下vue3.0的安装以及创建第一个项目。 官方对js包管理为我们提供了两个选择，npm和yarn。我这里比较倾向使用yarn。 关于yarn的介绍，请移步《js包管理工具yarn》