Skip to content

Hooks 函数

useCurtInstance

获取当前 vue 组件实例及相关操作函数

useCurtInstance(): useCurtInstanceResult

  • useCurtInstanceResult - useCurtInstance() 返回值
    • currentInstance: ComputedRef<ComponentInternalInstance | null> - 当前组件实例
    • currentProps: ComputedRef<Record<string, any>> - 当前组件接收到的属性
    • globalVars: ComputedRef<Record<string, any>> - 当前应用全局变量
    • existEmit: (emitName: string) => boolean - 判断当前组件是否存在指定的分发事件
vue
<script setup lang="ts">
  import { useCurtInstance } from "@easyui/element-plus-pro";

  const emits = defineEmits(["update"]);
  const { existEmit } = useCurtInstance();
  
  console.log(`当前组件是否存在 update 分发事件:${ existEmit("onUpdate") }`);
</script>

useComputeModel

对象及数组类型计算属性值修改辅助函数

useComputeModel(): useComputeModelResult

  • useComputeModelResult - useComputeModel() 返回值
    • getAryEntryModel: <T> (array: ComputedModelSource<T[]>, index: number) => WritableComputedRef<T> - 修改数组类型属性单个元素值
    • getAryPickModel: <T> (array: ComputedModelSource<T[]>, indexes: number[]) => WritableComputedRef<T[]> - 修改数组类型属性多个元素值
    • getObjEntryModel: <T> (object: ComputedModelSource<object>, keyPath: string) => WritableComputedRef<T> - 修改对象类型属性单个元素值
    • getObjPickModel: <T> (object: ComputedModelSource<object>, pickKeys: string[]) => WritableComputedRef<T> - 修改对象类型属性多个元素值
vue
<template>
  <!-- 修改数组类型属性单个元素值 -->
  <input v-model="firstCar" placeholder="请输入" />
  <!-- 修改对象类型属性单个元素值 -->
  <input v-model="useName" placeholder="请输入" />
</template>

<script setup lang="ts">
  import { computed } from "vue";
  import { useComputeModel } from "@easyui/element-plus-pro";

  const { getAryEntryModel, getObjEntryModel } = useComputeModel();
  const emits = defineEmits(["update:cars", "update:user"]);
  const props = defineProps({
    cars: { type: Array as () => string[], default: () => ([]) },
    user: { type: Object as () => Record<string, any>, default: () => ({}) }
  });

  const carList =  computed<string[]>({
    get: () => props.cars || [],
    set: (value: string[]) => emits("update:cars", value)
  });
  const userInfo =  computed<Record<string, any>>({
    get: () => props.user || {},
    set: (value: Record<string, any>) => emits("update:user", value)
  });

  const firstCar = getAryEntryModel(carList, 0);
  const useName = getObjEntryModel(userInfo, "name");
</script>