vue项目使用typescript创建抽象类及其使用方式

export abstract class ListPage {
  #queryForm //查询框表单对象，例如：const queryForm = ref()，<el-form ref="queryForm">
  #myPageSetup //分页对象，例如：const myPageSetup = cloneDeep(pageSetup)

  constructor(queryForm, pageSetup) {
    this.#queryForm = queryForm
    this.#myPageSetup = pageSetup
  }

  //列表数据请求。抽象方法，子类必须实现
  abstract doQuery(): void

  //查询
  onSearch = () => {
    this.#myPageSetup.pageIndex = 1
    this.doQuery()
  }
  //重置
  onReset = () => {
    this.#queryForm.value.resetFields()
  }
  //跳转至指定页码
  onPageChange = (pageIndex) => {
    this.#myPageSetup.pageIndex = pageIndex
    this.doQuery()
  }
  //改变分页大小
  onPageSizeChange = (size) => {
    this.#myPageSetup.pageIndex = 1
    this.#myPageSetup.pageSize = size
    this.doQuery()
  }
  //排序
  onColumnSort = ({ prop, order }) => {
    this.#myPageSetup.order = order
    this.#myPageSetup.sort = prop
    this.doQuery()
  }
}

class MyListPage extends ListPage {
  constructor() {
    super(defaultQueryForm, myPageSetup) // 在派生类的构造函数中必须调用super()
  }

//实现抽象方法。async代表异步，基类中的没有声明是否异步，既可以异步，也可以不异步。
  doQuery = async () => {
	//巴拉巴拉巴拉
  }
}
const myListPage = new MyListPage()
myListPage.onSearch()