Просмотр исходного кода

feat(menu): 优化菜单管理页面的标签切换逻辑

- 引入 nextTick 确保 DOM 更新后再加载数据
- 修复标签切换时分页数据未重置的问题
- 添加调试日志便于排查 tab 切换逻辑
- 调整 handleTabClick 方法签名以接收参数
qrs 3 недель назад
Родитель
Сommit
4635013453
1 измененных файлов с 7 добавлено и 4 удалено
  1. 7 4
      src/views/storeDecoration/menuManagement/index.vue

+ 7 - 4
src/views/storeDecoration/menuManagement/index.vue

@@ -131,7 +131,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, reactive, computed, onMounted } from "vue";
+import { ref, reactive, computed, onMounted, nextTick } from "vue";
 import { ElMessage, ElMessageBox } from "element-plus";
 import type { FormInstance, FormRules } from "element-plus";
 import { Picture } from "@element-plus/icons-vue";
@@ -254,10 +254,12 @@ const rules = reactive<FormRules>({
 });
 
 // Tab切换
-const handleTabClick = async () => {
+const handleTabClick = async val => {
   pageable.pageNum = 1;
-  await loadDishList();
-  updatePagination();
+  nextTick(async () => {
+    await loadDishList();
+    updatePagination();
+  });
 };
 
 // 更新分页总数
@@ -540,6 +542,7 @@ const loadDishList = async () => {
 
     // 根据tab切换调用不同的dishType参数
     // dishType: 0表示菜单, 1表示推荐
+    console.log(activeTab.value, activeTab.value === "recommended" ? 1 : 0, "zz---xx");
     const dishType = activeTab.value === "recommended" ? 1 : 0;
     const res: any = await getDishList({ storeId: Number(storeId), dishType });