Flask+Vue3前端

常用工具包\Python_Pyjwt_Flask.py """ vue3_admin 自定义后端接口服务 """ import paramiko from […]

Vue\vue3_admin\src\utils\request.ts // 进行axios 二次封装：使用请求与响应拦截器 import axios from "axios"; import { […]

Vue\vue3_admin\src\router\index.ts // import { createRouter, createWebHistory, createWebHashHistory } from & […]

Vue\vue3_admin\src\permission.ts // 路由鉴权，项目当中路由能不能被访问的设置 import router from "./router"; import set […]

Vue\vue3_admin\src\main.ts import { createApp } from 'vue' import { createPinia } from 'pinia […]

【Teleport】 什么是Teleport？—— Teleport 是一种能够将我们的组件html结构移动到指定位置的技术。 <teleport to='body' > <di […]

【shallowRef 与 shallowReactive 】 shallowRef 作用：创建一个响应式数据，但只对顶层属性进行响应式处理。 用法： let myVar = shallowRef(initialVa […]

【slot】 默认插槽 父组件中： <Category title="今日热门游戏"> <ul> <li v-for="g in games" : […]

组件通信 Vue3组件通信和 Vue2的区别： 移出事件总线，使用 mitt代替。 vuex换成了 pinia。 把 .sync优化到了 v-model里面了。 把 $listeners所有的东西，合并到 $attr […]

【搭建 pinia 环境】 第一步：npm install pinia 第二步：操作 src/main.ts import { createApp } from 'vue' import App […]

【基本切换效果】 Vue3中要使用 vue-router的最新版本，目前是 4版本。 路由配置文件代码如下： import {createRouter,createWebHistory} from 'vue […]

【自定义hook】 什么是 hook？—— 本质是一个函数，把 setup函数中使用的 Composition API进行了封装，类似于 vue2.x中的 mixin。 自定义 hook的优势：复用代码, 让 set […]

【生命周期】 概念：Vue组件实例在创建时要经历一系列的初始化步骤，在此过程中 Vue会在合适的时机，调用特定的函数，从而让开发者有机会在特定阶段运行自己的代码，这些特定的函数统称为：生命周期钩子 规律： 生命周期整 […]

【props】 // 定义一个接口，限制每个Person对象的格式 export interface PersonInter { id:string, name:string, age:number } // 定义一 […]

【标签的 ref 属性】 作用：用于注册模板引用。 用在普通 DOM标签上，获取的是 DOM节点。 用在组件标签上，获取的是组件实例对象。 用在普通 DOM标签上： <template> <div […]

【watch】 作用：监视数据的变化（和 Vue2中的 watch作用一致） 特点：Vue3中的 watch只能监视以下四种数据： ref定义的数据。 reactive定义的数据。 函数返回一个值（getter函数） […]