草庐IT

language-ts

全部标签

vite+ts+vue3+router4+Pinia+ElmPlus+axios+mock项目基本配置

1.vite+TS+Vue3npmcreateviteProjectname:...yourProjectNameSelectaframework:>>VueSelectavariant:>>Typescrit2.修改vite基本配置配置Vite{#configuring-vite}|Vite中文网(vitejs.cn)vite.config.tsimport{defineConfig}from'vite'importvuefrom'@vitejs/plugin-vue'import{resolve}from'path';//编辑器提示path模块找不到,可以cnpmi@types/node-

一文读懂TS in操作符

in操作符作用:遍历类型基本用法typeroles="tester"|"developer"|"manager";conststaffCount:{[kinroles]:number}={tester:100,developer:200,manager:300,};上述代码规定staffCount是一个对象,属性名为roles约束的三个,值为number类型类型变量k,以此绑定到对象的每一个属性遍历三个字符串字面量组成的联合类型rolesnumber为每个属性的值的类型类型映射在映射类型里,新类型以新的规则转换基类型的每一条规则.类似于class的继承interfacepublicObj{//

一文读懂TS索引签名

索引:对象或数组的对应位置的名字数组的索引就是number类型的0,1,2,3...对象的索引就是string类型的属性名数字索引签名:通过定义接口用来约束数组typenumberIndex{[index:number]:string}consttestArray:numberIndex=["1","2",3]//不能将类型“number”分配给类型“string”。ts(2322)所需类型来自此索引签名可以看到testArray数组的第三位不符合numberIndex的约束.TIP索引签名的名称如[index:number]:string里的index除了可读性外,并无任何意义.但有利于下一

一文读懂TS in操作符

in操作符作用:遍历类型基本用法typeroles="tester"|"developer"|"manager";conststaffCount:{[kinroles]:number}={tester:100,developer:200,manager:300,};上述代码规定staffCount是一个对象,属性名为roles约束的三个,值为number类型类型变量k,以此绑定到对象的每一个属性遍历三个字符串字面量组成的联合类型rolesnumber为每个属性的值的类型类型映射在映射类型里,新类型以新的规则转换基类型的每一条规则.类似于class的继承interfacepublicObj{//

一文读懂TS索引签名

索引:对象或数组的对应位置的名字数组的索引就是number类型的0,1,2,3...对象的索引就是string类型的属性名数字索引签名:通过定义接口用来约束数组typenumberIndex{[index:number]:string}consttestArray:numberIndex=["1","2",3]//不能将类型“number”分配给类型“string”。ts(2322)所需类型来自此索引签名可以看到testArray数组的第三位不符合numberIndex的约束.TIP索引签名的名称如[index:number]:string里的index除了可读性外,并无任何意义.但有利于下一

Vite+TS项目:论如何便捷的使用pinia

这里给大家分享我在网上学习总结出来的一些知识,希望对大家有所帮助pinia介绍vue新一代状态管理库,相当于vuex特性1.像定义components一样定义store2.支持ts3.去除mutations,只有state,getters,actions(支持同步异步)4.轻量级(1kb)5.vuex是要有主入口进行统一导入,pinia可以分模块导入pina简单使用1.导入path项目全局安装@type/nodenpminstall@types/node--save-dev2.config设置@指标 3.tsconfig.json设置@指标4.导入pinia项目全局安装pinianpminst

Vite+TS项目:论如何便捷的使用pinia

这里给大家分享我在网上学习总结出来的一些知识,希望对大家有所帮助pinia介绍vue新一代状态管理库,相当于vuex特性1.像定义components一样定义store2.支持ts3.去除mutations,只有state,getters,actions(支持同步异步)4.轻量级(1kb)5.vuex是要有主入口进行统一导入,pinia可以分模块导入pina简单使用1.导入path项目全局安装@type/nodenpminstall@types/node--save-dev2.config设置@指标 3.tsconfig.json设置@指标4.导入pinia项目全局安装pinianpminst

安装typescript环境并开启VSCode自动监视编译ts文件为js文件

一、前言小编最近开始学习typescript,懂得人都知道,typescript是vue3的基础伴生,配合更加默契。就像vue2和js一样!typescript不像js那样浏览器直接可以解读,需要我们把ts文件编译成js文件,这样浏览器才可以解读。所以我们要安装一下ts的环境和自动编译,方便我们后续学习,不需要写完一个ts文件在手动编译!二、安装typescript环境必须要有node环境哈!win+R输入cmdnpminstall-gtypescript-g代表global全局安装查看版本tsc-v三、VSCode配置自动监视编译1.新建一个文件夹2.在终端打开3.初始化配置文件tsc--i

安装typescript环境并开启VSCode自动监视编译ts文件为js文件

一、前言小编最近开始学习typescript,懂得人都知道,typescript是vue3的基础伴生,配合更加默契。就像vue2和js一样!typescript不像js那样浏览器直接可以解读,需要我们把ts文件编译成js文件,这样浏览器才可以解读。所以我们要安装一下ts的环境和自动编译,方便我们后续学习,不需要写完一个ts文件在手动编译!二、安装typescript环境必须要有node环境哈!win+R输入cmdnpminstall-gtypescript-g代表global全局安装查看版本tsc-v三、VSCode配置自动监视编译1.新建一个文件夹2.在终端打开3.初始化配置文件tsc--i

记录--TS封装axios

这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助写在前面虽然说FetchAPI已经使用率已经非常的高了,但是在一些老的浏览器还是不支持的,而且axios仍然每周都保持2000多万的下载量,这就说明了axios仍然存在不可撼动的地位,接下来我们就一步一步的去封装,实现一个灵活、可复用的一个请求请发。这篇文章封装的axios已经满足如下功能:无处不在的代码提示;灵活的拦截器;可以创建多个实例,灵活根据项目进行调整;每个实例,或者说每个接口都可以灵活配置请求头、超时时间等;取消请求(可以根据url取消单个请求也可以取消全部请求)。基础封装首先我们实现一个最基本的版本,实例代码如下://i