项目提取公共接口方法

项目的多个页面，需要调用接口getList展示下拉列表,以往我做法就是在每个需要的页面分别调取一次该接口，造成资源的浪费。
把复用的东西抽取出来，方便复用和修改。

解决方法1：

封装common.js(里边是公共调用的api)

import { GetCategory } from "./info"
import { reactive } from "@vue/composition-api"
/**
 * 获取分类信息列表
 */
export function common() {
	const categroyList = reactive({
		list: [],
	})
	const getCategory = () => {
		GetCategory({})
			.then((result) => {
				categroyList.list = result.data.data.data
			})
			.catch((err) => {})
	}
	return {
		//reactive
		categroyList,
		//methods
		getCategory,
	}
}

在需要引用的页面：

//引入
import {common} from "@/api/common";
const {categroyList,getCategory} = common();
//监听
watch(() => categroyList.list,(value) => {
    typeOptions.list = value;
})

解决方法2：

可以用vuex的actions，异步封装方法。actions可以把结果return 出去。