将Set初始化为AlpineJS的局部变量

Question

是否可以将Set分配给AlpineJS中的变量?

x-data="{ show: {} }" x-init="show = new Set('a', 'b', 'c')"

我正在尝试用集合的帮助替换本地数组代码。

@click="this.event.target.checked ? show.push(key) : show.splice(show.indexOf(key))"

Answer 1

可以在x-data中定义空Set()，并使用x-init添加元素。也可以在x-data

中添加整个Set

<script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js"></script>
<div x-data="{ show: new Set() }" x-init="() => { show.add('a'); show.add('b'); show.add('c'); }">
<template x-for="item in Array.from(show)">
<label>
<span x-text="item"></span>
</label>
</template>
</div>

<div x-data="{ show: new Set(['a', 'b', 'c']) }">
<template x-for="item in Array.from(show)">
<label>
<span x-text="item"></span>
</label>
</template>
</div>