赞
踩
前言摘抄自 Vue.js 官网组合式函数介绍
在 Vue 应用的概念中,“组合式函数”(Composables) 是一个利用 Vue 的组合式 API 来封装
和复用有状态逻辑
的函数
。
“组合式函数”和 Vue 2 中的 mixins 功能比较相近,它也让我们能够
把组件逻辑提取到可复用的单元里
。然而 mixins 有三个主要的短板:
import { ref, onActivated } from 'vue' export default function () { const loading = ref(true) const getData = (isLoading: boolean) => { // isLoading:组件传入参数 loading.value = isLoading setTimeout(() => { // 模拟异步接口请求完成后取消 loading loading.value = false }, 3000); } onActivated(() => { getData(true) // 先调用 }) return { loading, getData } }
<template>
<div v-loading="loading">
xxx
</div>
</template>
<script setup lang="ts">
import useCustomTab from '@/hooks/useCustomTab'
const { loading, getData } = useCustomTab()
onActivated(() => {
getData(true) // 后调用
})
</script>
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。