指尖上的记忆指尖上的记忆
首页
  • 基础
  • Laravel框架
  • Symfony框架
  • 基础
  • Gin框架
  • 基础
  • Spring框架
  • 命令
  • Nginx
  • Ai
  • Deploy
  • Docker
  • K8s
  • Micro
  • RabbitMQ
  • Mysql
  • PostgreSsql
  • Redis
  • MongoDb
  • Html
  • Js
  • 前端
  • 后端
  • Git
  • 知识扫盲
  • Golang
🌟 gitHub
首页
  • 基础
  • Laravel框架
  • Symfony框架
  • 基础
  • Gin框架
  • 基础
  • Spring框架
  • 命令
  • Nginx
  • Ai
  • Deploy
  • Docker
  • K8s
  • Micro
  • RabbitMQ
  • Mysql
  • PostgreSsql
  • Redis
  • MongoDb
  • Html
  • Js
  • 前端
  • 后端
  • Git
  • 知识扫盲
  • Golang
🌟 gitHub
一段典型的typeScript代码
export function useDataTable<T>(input: MaybeRef<UseDataTableOptions<T>>) {
  const options = computed(() => toValue(input));
  const withoutPagination = computed(() => options.value.pagination === false);
}

typeScript的自动类型推导:
在调用 useDataTable 的时候,可以不用传递T的类型,可以通过参数 input 自动推断出 T 的类型,前提是 input 定义了类型或者ts很容易推导出类型

关于MaybeRef<T>: 根据官网可以知道这是 T | Ref<T> 的别名, 原文: MaybeRef<T>: Alias for T | Ref<T>
针对上面的, input可以是 UseDataTableOptions<T> 类型,也可以是 Ref<UseDataTableOptions<T>> 类型, 比如是一个computed 的 UseDataTableOptions<T> 对象

关于tovalue:
将值/引用/获取器规范化为值。(Normalizes values / refs / getters to values.)

官方定义:
function toValue<T>(source: T | Ref<T> | (() => T)): T

例子:
toValue(1) //       --> 1
toValue(ref(1)) //  --> 1
toValue(() => 1) // --> 1


相关参考:
https://vuejs.org/api/utility-types#mayberef
https://vuejs.org/api/reactivity-utilities.html#tovalue