vue  composition-api 封装组合式函数的操作方法

import { computed } from 'vue'

export function useAdd(a,b) {
 return computed(() => a.value + b.value)
}

import { ref } from 'vue'
import { useAdd } from './add.js
const a = ref(1)
const b = ref(2)
const c = useAdd(a,b)

export function useTitle(newTitle = null, options = {}) {
  const {
    document = defaultDocument,
    observe = false,
    titleTemplate = '%s',
  } = options
  // ...
}

export default useNow(options) {
  const { controls = false } = options;

  // ...

  if (!controls) {
    return value;
  } else {
     return { value, controlAction1, controlAction2 };
  }
}

import { useNow } from '@vueuse/core'

const now = useNow()

// 返回控制暂停/恢复的函数
const { now, pause, resume } = useNow({ controls: true })

type MaybeRef<T> = Ref<T> | T

import { unref } from 'vue'

function useFeature(maybeRef) {
  const value = unref(maybeRef)
  //...
}

function unref <T> (r:Ref<T>|T): T) {
  return isRef(r) ? r.value : r
}

import { ref, watch } from 'vue'
export function useTitle(newTitle) {
  const title = ref(newTitle || document.title)
  watch(title, (t) => {
    if (t != null) document.title = t}, 
        { immediate: true }
  )
  return title
}

const { res } = useFetch('https://xxx.com/').json()
const data = computed(() => res.value?.data)

import { shallowRef } from 'vue'

export function useFetch<>(url) {
    const data = shallowRef(null)
    const error = shallowRef(null)
    fetch(unref(url)).then(r => r.json())
    .then(r => data.value = r)
    .catch(e => error.value = e)

  return {
        data,
        error
    }
}

// store.js
import { reactive } from 'vue'

export const store = reactive({
  a: 0,
  b: 1
})