59 lines
1.5 KiB
Vue
59 lines
1.5 KiB
Vue
<script setup lang="ts">
|
|
import { $enum } from 'ts-enum-util';
|
|
|
|
enum Direction {
|
|
Up = 'UP',
|
|
Down = 'DOWN',
|
|
Left = 'LEFT',
|
|
Right = 'RIGHT',
|
|
}
|
|
|
|
enum TestEnum {
|
|
A,
|
|
B,
|
|
}
|
|
|
|
const visitValue = (value: Direction | null | undefined) => {
|
|
$enum.visitValue(value).with({
|
|
[Direction.Up]: () => {},
|
|
[Direction.Down]: () => {},
|
|
[Direction.Left]: () => {},
|
|
[Direction.Right]: () => {},
|
|
[$enum.handleNull]: () => {},
|
|
[$enum.handleUndefined]: () => {},
|
|
[$enum.handleUnexpected]: () => {},
|
|
});
|
|
};
|
|
|
|
const mapValue = (value: Direction | null | undefined) => {
|
|
return $enum.mapValue(value).with({
|
|
[Direction.Up]: 'Up',
|
|
[Direction.Down]: 'Down',
|
|
[Direction.Left]: 'Left',
|
|
[Direction.Right]: 'Right',
|
|
[$enum.handleNull]: 'Null',
|
|
[$enum.handleUndefined]: 'Undefined',
|
|
[$enum.handleUnexpected]: 'Unexpected',
|
|
});
|
|
};
|
|
</script>
|
|
|
|
<template>
|
|
<h1>TS Enum Util</h1>
|
|
<div flex="~ row">
|
|
<button class="green" @click="$router.back()">Back</button>
|
|
</div>
|
|
<main>
|
|
<p>TestEnum: {{ TestEnum }}</p>
|
|
<p>Direction: {{ Direction }}</p>
|
|
<ul list-circle>
|
|
<li>{{ `.getKeys(): ${$enum(Direction).getKeys()}` }}</li>
|
|
<li>{{ `.getValues(): ${$enum(Direction).getValues()}` }}</li>
|
|
<li><button class="green" @click="visitValue(Direction.Up)">Visit Value</button></li>
|
|
<li>{{ `.mapValue(null): ${mapValue(null)}` }}</li>
|
|
<li>getKeyOrDefault</li>
|
|
<li>getValueOrDefault</li>
|
|
</ul>
|
|
</main>
|
|
</template>
|