前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >ts中枚举

ts中枚举

作者头像
阿超
发布2022-08-21 14:11:23
5180
发布2022-08-21 14:11:23
举报
文章被收录于专栏:快乐阿超快乐阿超

填坑,官方文档:https://www.tslang.cn/docs/handbook/enums.html

我新建了一个vue项目用来演示

这里代码如下:

代码语言:javascript
复制
enum Direction {
  Up,
  Down,
  Left,
  Right
}
console.log({ Direction });
console.log({ 'Object.entries(Direction)': Object.entries(Direction) });
console.log({ 'Direction[0]': Direction[0] });
console.log({ 'Direction.Up': Direction.Up });

打印结果如下:

image-20220619171805339
image-20220619171805339

定义一个双向绑定的值

代码语言:javascript
复制
const count = ref(Direction.Up)

在下方使用

代码语言:javascript
复制
<button type="button" @click="count++">count is: {{ count + Direction[count] }}</button>

默认是0Up

image-20220619171934326
image-20220619171934326

点一下

image-20220619171950277
image-20220619171950277

这说明对枚举进行递增,等于对齐值进行递增

我们这里将枚举中定义字符串初始值

代码语言:javascript
复制
enum Direction {
  Up = '上',
  Down = '下',
  Left = '左',
  Right = '右'
}

然后发现之前生成的8个属性变成了4个,不支持直接使用值进行反向映射了

image-20220619172508208
image-20220619172508208
image-20220619172532224
image-20220619172532224

也无法自增了

image-20220619172622989
image-20220619172622989

但我们仍然可以使用这种方式

image-20220619172708362
image-20220619172708362

让其初始值变为1,后面的也会依次递增

比如这样写:

代码语言:javascript
复制
enum Direction {
  Up = 1,
  Down,
  Left,
  Right = 10
}

生成的结果为:

代码语言:javascript
复制
{
    "1": "Up",
    "2": "Down",
    "3": "Left",
    "10": "Right",
    "Up": 1,
    "Down": 2,
    "Left": 3,
    "Right": 10
}
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2022-06-19,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档