Vue3+TS使用纯组件页面的控制页面跳转方式

最新推荐文章于 2026-06-14 13:14:55 发布

原创最新推荐文章于 2026-06-14 13:14:55 发布 · 981 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#vue.js #typescript #javascript

收录于

vue 同时被 3 个专栏收录

13 篇文章

订阅专栏

后管开发--JEECG

5 篇文章

订阅专栏

TypeScript

2 篇文章

订阅专栏

该博客介绍了在 Vue 中使用枚举（ShowTypeEnum）进行状态管理的方法。通过定义常量枚举，如 LIST, INFO 等，来规范组件显示类型。同时展示了如何创建一个响应式的 type 变量，并提供 changeShowType 函数用于切换显示类型，确保组件状态的更新。内容主要涉及 Vue 的响应式原理和状态管理实践。

import { ref } from 'vue';

export enum ShowTypeEnum {
  LIST,
  INFO,
  ORDER,
  APPOINT,
  FIRST_TEST,
  SECOND_TEST,
  OFFER_APPLY,
  OFFER_SEND,
}
const type = ref(ShowTypeEnum.LIST);
export const useShowType = () => {
  const changeShowType = (showType?: ShowTypeEnum) => {
    console.log(showType);
    type.value = showType ? showType : ShowTypeEnum.LIST;
  };
  return { type, changeShowType };
};