我正在嘗試添加一個按鈕，該按鈕在單擊時會更改顏色并在 true 和 false 之間更改 isCompleted，我做錯了什么？我試圖將“checkCompleted”更改為“checkCompleted(task)”，但它仍然給出相同的錯誤
（額外的文字，所以 stackoverflow 允許我發布問題，他們一直說代碼太多而文字不夠）
<template>
<div >
<div v-for="(task, index) in tasks" :key="index">
<div >
<div >
<h4>{{ task.title }}</h4>
</div>
<p>{{ task.description }}</p>
<button
@click="checkCompleted"
v-if="!isCompleted"
>
Completed
</button>
<div v-else>Incomplete</div>
</div>
</div>
</div>
</template>
<script>
export default {
name: "Home",
data() {
return {
tasks: [
{
title: "Read Books",
description:
"Lorem ipsum dolor sit amet consectetur, adipisicing elit. Alias accusamus iste asperiores excepturi tempore unde.",
isCompleted: false,
},
{
title: "Wash Plates",
description:
"Lorem ipsum dolor sit amet consectetur, adipisicing elit. Alias accusamus iste asperiores excepturi tempore unde.",
isCompleted: false,
},
{
title: "Play Fifa",
description:
"Lorem ipsum dolor sit amet consectetur, adipisicing elit. Alias accusamus iste asperiores excepturi tempore unde.",
isCompleted: false,
},
{
title: "Go Gym",
description:
"Lorem ipsum dolor sit amet consectetur, adipisicing elit. Alias accusamus iste asperiores excepturi tempore unde.",
isCompleted: false,
},
],
};
},
methods: {
checkCompleted() {
this.isCompleted = this.isCompleted ? true : false;
},
},
};
</script>
uj5u.com熱心網友回復：
您正在回圈并希望從每個任務中參考 isCompleted 所以
v-if="!isCompleted"
應該
v-if="!task.isCompleted"
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/366319.html