mkbird的博客

操作项大部分table都具有button用于编辑删除等操作，我们在传入options的中定义操作项的action为true，因为操作的特殊性，我们选择单独编写，所以要先处理传入的数据，将操作项与数据部分分离// 传入options的数据 let options : TableOptions [ ] = [ {............

先上效果图样式采用elementplus，各个组件详情查看elementplus官网整体采用popover作弹出框，需要注意的是elementplus，使用插槽的方式，标题一个在popover里的reference具名插槽，插槽内部我们添加标题和下拉图标下拉图标采用arrowdown（该图标为elementplus图标库封装后的，自己的项目请按照elementplus官网的用法）,class通过visible控制样式，如果弹出框可见，代表此时已经下拉，将下拉箭头改为上拉。......

在自己封装好的组件文件夹下创建index.tsimport {App } from 'vue' // 导入自己的组件 import chooseArea from './chooseArea.vue' // 让这个组件可以以use的形式使用 export default {在组件总项目下创建index.ts导入上面的ts文件并使用import {

项目中的TS最终都会编译成JS，那我们在使用外部的三方库时，如何使用TS语法呢。类型声明文件：用来为已存在的JS库提供类型信息如果要为JS库提供类型信息，就要用到.d.ts文件windows系统按ctrl键点击内置API即可打开文件在TypeScript官网搜索下载即可如果多个ts文件都用到同一类型，可以创建.d.ts文件提供该类型，实现类型共享在导入一个js文件时，TS会自动加载于js文件同名的.d.ts文件使用declare关键字：用于类型声明，为js文件中已存在的变量声明类型，而不是创建一个新的变量

构造函数实例方法实现接口修饰符public(公有)：默认，可以被任何地方访问protected(受保护)：仅在对其声明所在类和子类中(非实例对象)可见private(私有的)：只在当前类中可见(实例对象和子类都不可见)readonly(只读修饰符)：防止在构造函数之外对属性进行赋值；只能修饰属性，不能修饰方法注意：readonly和const的意思一样，都是不能修改，所以它和const一样，如果直接赋初值(不指定类型)，数据类型就会变成字面量同样，readonly也可以

代码中的就是类型注解，约定遍历age的类型必须为number，否则就会报错JS已有类型TS新增类型用即可联合类型类型别名函数类型函数要指明参数和返回值的类型同时指定参数、返回值类型可选参数对象类型同样，对象中的属性也可以使用?可选相当于在对象中使用类型别名接口继承多个接口有相同属性或方法，可以抽离出来，通过继承实现复用元组元组是特殊类型的数组，它规定了数组元素对应的数据类型(个数也受到了限制)类型推论声明变量并初始化决定函数返回值时满足任意一个都会触发类型