<template>
<div id="app">
<input type="text" v-model="todo">
<button @click="addObj()">+添加</button>
<ul>
<li v-for="(item,key) in todoList">{{item}} <button @click="deleteObj(key)">刪除</button></li>
</ul>
<router-view/>
</div>
</template>
<script>
export default {
name: 'App',
data (){
return{
todo:'',
todoList:[],
}
},
methods:{//用于放置自定義方法
addObj(){
if(!Object.is(this.todo,'')){
this.todoList.push(this.todo);
}
this.todo='';
},deleteObj(key){
this.todoList.splice(key,1);//splice() 方法向/從數(shù)組中添加/刪除項目决瞳，然后返回被刪除的項目掷倔。
//arrayObject.splice(index,howmany,item1,.....,itemX):index 必需耍缴。整數(shù)辩蛋，規(guī)定添加/刪除項目的位置，使用負(fù)數(shù)可從數(shù)組結(jié)尾處規(guī)定位置碟贾。howmany 必需币喧。要刪除的項目數(shù)量轨域。如果設(shè)置為 0，則不會刪除項目杀餐。item1, ..., itemX 可選干发。向數(shù)組添加的新項目。
}
}
}
</script>
<style>
app {
font-family: 'Avenir', Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
color: #2c3e50;
margin-top: 60px;
}
</style>
