Javascript Vue@click="；item.click | |（（）=>；{}）"；未按预期进行评估

我是

v-for

某些数据中的一些按钮，这些数据包含我要绑定到

的

回调

我知道其中一些数据没有回调，所以我写了这个

然而，这一行并没有像我预期的那样工作，现在，我所有的按钮的点击事件都不再起作用了

请看这个最小的例子

<template>
  <div>
    <div v-for="(item, itemIndex) in data" :key="itemIndex">
      <button @click="item.click || (() => {})">Click {{ itemIndex }}</button>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      data: [
        {
          click: () => {
            alert("First Item");
          },
        },
        {
          // Empty Object
        },
      ],
    };
  },
};
</script>

单击{{itemIndex}}
导出默认值{
数据（）{
返回{
数据：[
{
点击：（）=>{
警报（“第一项”）；
},
},
{
//空对象
},
],
};
},
};

我应该如何防止空回调

这是我的

---

（单击0不起作用）

您应该在

单击
侦听器中执行此操作：

@click="item.click ? item.click() : (() => {})"

而不是

@click="item.click || (() => {})"

没有
项。click（）
尝试执行click函数，而不是将函数引用传递给
@click
？@JosephWang不客气，如果解决了您的问题，请将答案标记为解决方案。