03 2022 档案
摘要：现在有四个组件,如图所示,调用的结构如图所示 为方便使用,在组件二中封装的是一些公共插槽传递到组件三中进行解析, 但是不可能所有的页面内容全部相同,所以不能将只在某个页面中使用的插槽放到组件2中, 应该由组件一中的配置文件来决定,通过跨组件插槽来解决这个问题 下面是代码 组件1: <template
阅读全文
摘要：当我们希望在vue组件中使用useStore,并想为它指定类型来保证它更安全时,会出现一些问题, 举个栗子: 这是一个模块化的store,当我们希望使用子模块的类型时, 而在index.ts下同样拿不到子模块的类型, 解决方案: 新建一个接口,包含子模块的类型, 再定义一个接口来结合index.ts
阅读全文
摘要：首先来看图 调用了一个函数,函数名后面跟了一个泛型,看样子是做了类型约束,但明显不是约束形参, 思索了一半天,这样来解释就清楚很多了: 定义function的时候函数名后面的泛型是约束形参的,那调用这个函数的时候在这个函数名后面写个泛型就是用来约束返回值的 并且这个泛型还可以做嵌套(用嵌套来形容有点
阅读全文
摘要：在使用element-plus的loading加载组件时,发现了这么一个方法 引发思考: 第一行代码很好懂,创建一个ElLoading的实例,其中options时启动loading的配置项 第三行代码很好懂,关闭这个loading实例, 那么第二行这个nextTick是干什么用的呢 我们不妨反向思考
阅读全文
摘要：axios有一个很棒的功能,就是对请求和响应进行拦截,那么如何在我们封装的代码中添加拦截器呢 首先文章1中可以看出,我们想使用axios,只能传入一个config参数,但是文章1中的config是AxiosRequestConfig类型的,我们进入源码看一下, 没有看到interceptor相关的属
阅读全文
摘要：所谓封装与模块化,对我这种初学者来说,个人理解就是解耦,比如说,当我们前端一个项目使用了现在流行的模块,但是没有对其进行封装处理,包括一些相同的代码逻辑,把他们分散在各个组件当中,这样一来整个项目对于这个模块的耦合度太高.如果将来这个模块突然停止维护,或者有更好的模块将其替代,我们想要更换模块时就显
阅读全文
摘要：这只是在使用element-plus组件开发过程中遇到的第一个问题,后面遇到更多问题及解决方案时会再同步到博客上来 我是分割线 今天用到element-plus时,想要使用element-plus的自动导入功能,但是出现了一些问题 我们先来看官方文档给出的方法: 首先安装依赖 npm install
阅读全文
摘要：T:Type K,V:key和value的缩写,键值对 E:ELement的缩写,元素 O:Object的缩写,对象
阅读全文
摘要：传统方式 setup() { const store = useStore() //传统方式 const aName = computed(() => store.state.name) return { aName } 如果数据多一点一个一个导入就十分的不方便 我们可以使用这样一种方法 setup
阅读全文
摘要：在使用 export 导出后，import 导入时需要使用花括号对应模块。使用 export default 后，可以省略花括号。且一个js模块只能有一个默认导出，因此在导入的时候可以随意命名。 但是当一个js文件导出多个特性时,需要使用大括号,并且导入时的名字和导出时需要相同
阅读全文
摘要：RT,码一下组件的v-model,知识点太多,没听懂...,后面学完回来再仔细看看
阅读全文
摘要：同一个组件内可以使用,但是在不同的组件内,不要用$parents或$refs来访问另一个组件内的数据, 这会使代码的耦合性变高,同时也会让代码的可读性变差, 在不同组件访问数据时,使用props等来传递数据
阅读全文
摘要：<!--动态组件--> <!--缓存,只缓存about和home组件--> <keep-alive exclude="about" > <component :is="currentTab" v-bind="msg"> </component> </keep-alive> 这里的v-bind:is绑
阅读全文
摘要：我们通常会在实际开发中,将项目进行分包处理,以此加快项目的速度 即使用异步组件 //异步组件,分包处理 import {defineAsyncComponent} from "vue"; import Loading from "@/11_异步组件的使用/Loading"; //1. const A
阅读全文
摘要：当我们在父组件定义了一个数组, data() { return { name: ["lkx", "msx"] } } 想把它传到子组件处理后 props: { names: { type: Array, default: () => [] } } 通过插槽的方式再传送回父组件 <template v
阅读全文
摘要：当我们在父组件中想要为子组件的某一个标签添加一些样式(注意,这里的是指attributes,css样式只是其中一种属性而已) <show-message id="lkx" class="lkx" title="HHH" content="123"></show-message> 如果不做任何设置,那
阅读全文
