vue+bootstrup实现炫酷记录表

                    </span>
                    <span class="badge" :class="{isFinish:item.isFinish}" @click='toggleItem(item)'>
                            <i class="glyphicon glyphicon-ok"></i>
    
                            </span>
                </a>
            </div>
        </div>
    </div>
</div>
<script>
    var LBC = (function() {
        return {
            add(value) {
                localStorage.setItem('todoList', JSON.stringify(value))
            },
            get() {
                return JSON.parse(localStorage.getItem('toduList'))
            },
            remove() {
                localStorage.removeItem('todoList')
            }
        }
    })()
    var vm = new Vue({
        el: "#app",
        data: {
            newItem: '',
            itemList: LBC.get() || []
        },
        methods: {
            addItem() {
                var item = {
                    id: this.itemList.length + 1,
                    title: this.newItem,
                    isFinish: false

                }
                this.itemList.push(item)
                LBC.add(this.itemList)
                this.newItem = ""
            },
            toggleItem(item) {
                item.isFinish = !item.isFinish;
                LBC.add(this.itemList)
            },
            removeItem(index) {
                this.itemList.splice(index, 1)
                LBC.add(this.itemList)
            }
        }
    })
</script>