created() { //this.bg(); let type = this.$route.query.type ? this.$route.query.type : ''; this.init(type); this.baseUrl = this.$config.baseUrl; }, methods: { getMakeZero(s) { return s < 10 ? '0' + s : s; }, // 下载 download(file){ window.open(`${file}`) }, // 初始化 init(type) { this.type = type; if(type=='cross'){ var obj = JSON.parse(localStorage.getItem('crossObj')); for (var o in obj){ if(o=='shiciming'){ this.ruleForm.shiciming = obj[o]; this.ro.shiciming = true; continue; } if(o=='fengmian'){ this.ruleForm.fengmian = obj[o].split(",")[0]; this.ro.fengmian = true; continue; } if(o=='shici'){ this.ruleForm.shici = obj[o]; this.ro.shici = true; continue; } if(o=='jiexi'){ this.ruleForm.jiexi = obj[o]; this.ro.jiexi = true; continue; } } } // 获取用户信息 this.$http.get(this.userTableName + '/session', {emulateJSON: true}).then(res => { if (res.data.code == 0) { var json = res.data.data; } }); }, // 多级联动参数 // 多级联动参数 info(id) { this.$http.get('jinrishici/detail/${id}', {emulateJSON: true}).then(res => { if (res.data.code == 0) { this.ruleForm = res.data.data; } }); }, // 提交 onSubmit() {
时间: 2023-12-30 07:04:58 浏览: 77
这段代码是一个 Vue.js 组件中的方法,其中包含了一些常见的 Vue.js 方法,例如 `created()` 和 `methods`。在 `created()` 钩子函数中,通过读取路由参数来初始化组件,并设置了一个 `baseUrl` 变量。在 `methods` 对象中定义了一些方法,例如 `getMakeZero()` 用于将数字转换为两位数,`download()` 用于下载文件,`init()` 用于初始化组件,`info()` 用于获取多级联动参数,`onSubmit()` 则用于提交表单。这段代码中还使用了 `this.$http` 来进行网络请求,其中 `get()` 方法用于发送 GET 请求。
相关问题
created() { this.indexQueryCondition = this.$route.query.indexQueryCondition ? this.$route.query.indexQueryCondition : ''; this.baseUrl = this.$config.baseUrl; this.getFenlei(); this.getList(1, '全部'); this.getHotList(); },
这段代码是 Vue.js 组件的 created 钩子函数,当组件被创建时会自动调用。具体实现的功能如下:
- 将路由中的 indexQueryCondition 参数赋值给组件的 indexQueryCondition 变量,如果参数不存在则将其赋为空字符串。
- 将 $config.baseUrl 赋值给组件的 baseUrl 变量。
- 调用 getFenlei 方法,获取分类数据。
- 调用 getList 方法,获取列表数据,默认传入页码为 1,分类为全部。
- 调用 getHotList 方法,获取热门数据列表。
methods: { // 按钮点击事件 显示新增编辑弹窗组件 show() { this.addOrUpdateVisible = true; }, showAddOrUpdate(data) { if (data === "false") { this.addOrUpdateVisible = false; } else { this.addOrUpdateVisible = true; } }, // 确认删除 handleConfirm() { var params = this.id deleteCategory(params).then((res) => { if (res.data.state === '200') { this.$router.push({ path: "/" }); } }) }, // 接收路由跳转传来的id getId() { this.id = this.$route.query.id }, // 获取新的页数 getNewPage(val) { this.currentPage = val }, // 分页获取帖子 getArticleByPage() { var params = { currentPage: this.currentPage, pageSize: this.pagesize, categoryId: this.$route.query.id, source: this.source, parameter: this.parameter } getArticlePage(params).then((res) => { }) }, //路由跳转到帖子详情界面 Articli_detail(item) { this.$router.push({ path: "/articledetail", query: { id: item.id } }) }, // 置顶帖子 handleTop(item) { var params = { articleId: item.id, categoryId: this.$route.query.id, top: true } topArticle(params).then((res) => { }) }, }, watch: { currentPage() { this.getArticleByPage() } }, beforeCreated() { this.getNewPage() }, created() { this.getId() this.getArticleByPage() }, };请将代码用async和await改写
你可以使用async和await来改写这段代码。下面是改写后的代码:
```javascript
methods: {
show() {
this.addOrUpdateVisible = true;
},
showAddOrUpdate(data) {
if (data === "false") {
this.addOrUpdateVisible = false;
} else {
this.addOrUpdateVisible = true;
}
},
async handleConfirm() {
var params = this.id;
try {
const res = await deleteCategory(params);
if (res.data.state === '200') {
this.$router.push({ path: "/" });
}
} catch (error) {
console.error(error);
}
},
getId() {
this.id = this.$route.query.id;
},
getNewPage(val) {
this.currentPage = val;
},
async getArticleByPage() {
var params = {
currentPage: this.currentPage,
pageSize: this.pagesize,
categoryId: this.$route.query.id,
source: this.source,
parameter: this.parameter
};
try {
await getArticlePage(params);
} catch (error) {
console.error(error);
}
},
Articli_detail(item) {
this.$router.push({ path: "/articledetail", query: { id: item.id } });
},
async handleTop(item) {
var params = {
articleId: item.id,
categoryId: this.$route.query.id,
top: true
};
try {
await topArticle(params);
} catch (error) {
console.error(error);
}
}
},
watch: {
async currentPage() {
await this.getArticleByPage();
}
},
async beforeCreate() {
await this.getNewPage();
},
async created() {
await this.getId();
await this.getArticleByPage();
}
```
通过将异步操作使用async和await包裹,并使用try-catch语句处理错误,可以更清晰地编写异步代码。同时,将beforeCreated和created生命周期钩子函数声明为async,并使用await等待异步操作完成。
阅读全文