<script src="./js/"></script>
<script>
const app = Vue.createApp({
watch: {
// Local storage of data
"list": {
handler(nval) {
localStorage.setItem("list", JSON.stringify(this.list));
},
deep: true
}
},
computed: {
// Filtering has been completed
"doneList": function () {
return this.list.filter(item => item.done)
},
// Filtering is not completed
"undoList": function () {
return this.list.filter(item => !item.done)
}
},
data() {
return {
list: JSON.parse(localStorage.getItem("list" || "[]")),
temp: '' //Storing input data
}
},
methods: {
addItem() {
this.list.unshift({
title: this.temp,
done: false
});
//Clear the list
this.temp = "";
},
removeItem(item) {
var idx = this.list.indexOf(item);
this.list.splice(idx, 1)
}
}
}).mount(".app")
</script>
