AlpineJS：如何将 x-for 变量传递给 x-data 函数

Question

你能帮忙吗？

我正在尝试根据循环中的某些属性添加倒计时，但我找不到任何方法（不是通过尝试也不是通过谷歌搜索）如何在我的函数中传递该值：

    <template x-for="item in cartData.items">
       [...]
        <template x-if="item.product_type == 'test'">
            <div  x-data="getCountdown()" x-init="init()">
                <span x-text="timeLeft(item.timerEnd)"></span>
            </div>
            <script type="text/javascript">[...]
            </script>
        </template>
    </template>

我试图将 item.timerEnd 传递给每个函数（getCountdown、init 和 timeLeft），但我总是收到 item 未定义的错误，如果我传递它，例如。至 <span x-text="new Date(item.timerEnd).toLocaleString()"></span> 这行得通。

我错过了什么？

PS：感谢fpr在这里的第一个帮助：How to make timer in alpine.js app with time interval

Answer 1

这样做$data.item.timerEnd。

像这样：

<template x-for="item in cartData.items">
       [...]
        <template x-if="item.product_type == 'test'">
            <div  x-data="getCountdown($data.item.timerEnd)" x-init="init($data.item.timerEnd)">
                <span x-text="timeLeft($data.item.timerEnd)"></span>
            </div>
            <script type="text/javascript">[...]
            </script>
        </template>
    </template>