确定 alpine.js for 循环中的最后一项
Identify last item in alpine.js for loop
我的 alpine.js 代码中有一个 for 循环
<template x-for="(value, index, collection) in forecastQ4Values" :key="index">
<div class="..."><span x-text="value"></span></div>
</template>
如何仅将 class 添加到 for 循环中的最后一项?
基本上我想隐藏最后一个元素,直到一些变量发生变化。
例如像这样,但仅限于最后一项。
<template x-for="(value, index, collection) in forecastQ4Values" :key="index">
<div :class="{ 'invisible': !productDActive }" class="..."><span x-text="value"></span></div>
</template>
谢谢
如果您有权访问索引,我的第一个想法是检查您在循环中的位置。像这样:
<template x-for="(value, index, collection) in forecastQ4Values" :key="index">
<div :class="{ 'invisible': (forecastQ4Values.size == index+1) }" class="..."><span x-text="value"></span></div>
</template>
我的 alpine.js 代码中有一个 for 循环
<template x-for="(value, index, collection) in forecastQ4Values" :key="index">
<div class="..."><span x-text="value"></span></div>
</template>
如何仅将 class 添加到 for 循环中的最后一项? 基本上我想隐藏最后一个元素,直到一些变量发生变化。
例如像这样,但仅限于最后一项。
<template x-for="(value, index, collection) in forecastQ4Values" :key="index">
<div :class="{ 'invisible': !productDActive }" class="..."><span x-text="value"></span></div>
</template>
谢谢
如果您有权访问索引,我的第一个想法是检查您在循环中的位置。像这样:
<template x-for="(value, index, collection) in forecastQ4Values" :key="index">
<div :class="{ 'invisible': (forecastQ4Values.size == index+1) }" class="..."><span x-text="value"></span></div>
</template>