vue.js - Nuxt 页面方法需要 js 方法
问题描述
我正在使用 nuxt js。有没有办法将代码与将在许多其他请求方法中重新使用的方法分离并将其放置在另一个文件夹/位置中,可能称为 devour.js
async asyncData({ $axios, route, params, $auth }) {
const jsonApi = new JsonApi({ apiUrl: $axios.defaults.baseURL });
jsonApi.headers["Authorization"] = $auth.getToken("local");
// this code below defining models i call it in many other pages many times //
jsonApi.define("team", {
name: "",
abbreviation: "",
sport: {
jsonApi: "hasOne",
type: "sports"
}
});
jsonApi.define("sport", {
name: "",
teams: {
jsonApi: "hasMany",
type: "teams"
},
tournaments: {
jsonApi: "hasMany",
type: "tournaments"
}
});
// up to here //
let { data, errors, meta, links } = await jsonApi.find(
"team",
route.params.id,
{
include: "sport"
}
);
return { data };
},
所以我正在考虑将我提到的代码放在另一页中。
更新:
我尝试像大卫在评论中所说的那样这样做,但是当我导入它时它就不起作用了。它说它是未定义的。
这是我的吞噬文件
import JsonApi from 'devour-client';
export default function ({ $axios, $auth }) {
const jsonApi = new JsonApi({ apiUrl: $axios.defaults.baseURL });
jsonApi.headers['Authorization'] = $auth.getToken('local');
jsonApi.define('team', {
name: '',
abbreviation: '',
sport: {
jsonApi: 'hasOne',
type: 'sports'
}
});
jsonApi.define('sport', {
name: '',
teams: {
jsonApi: 'hasMany',
type: 'teams'
},
tournaments: {
jsonApi: 'hasMany',
type: 'tournaments'
}
});
return jsonApi
}
这是我当前使用的脚本
import jsonApi from '~/api/devour';
async asyncData({ $axios, $auth, jsonApi }) {
let { data, errors, meta, links } = await jsonApi.findAll('teams', {
include: 'sport'
});
return { data };
},
解决方案
像这样的东西:
库/api.js
const loadStuff = async (params) => {...};
export { loadStuff };
组件/widget.vue
import { loadStuff } from '~/lib/api';
请注意,~/lib/api
路径会因文件名和构建环境而异。例如,它可能是@/lib/api
。
推荐阅读
- c++ - 如何使用模板遮罩遮罩多个对象
- c++ - C++ ostream 是否位于行首?
- mysql - 日期与 SQL 标准中的数字如何比较
- chronicle - 保存 ChronicleQueue 的消费者/尾部读取偏移量
- javascript - 如何从firebase存储(Javascript,React)中的下载链接获取文件名?
- python - 在python中按行对二维数组进行排序
- python - s[:] 和 s 之间的差异,引用和副本之间的差异
- java - JavaParser如何在CompilationUnit中获取类名
- java - 在spring jpa中将数据插入多个表
- excel - 如何根据不同单元格中的特定条目向单元格添加自定义文本?