vue实现的代办事项功能-html代码-BFW代码库

vue实现的代办事项功能

代码语言：html

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>BFW NEW PAGE</title>
    <script id="bfwone" data="dep=vue&err=0" type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/bfwone.js"></script>
    <script type="text/javascript">
        bready(function() {
            Vue.component('togglebutton', {
                props: ['label', 'name'],
                template: `<div class="togglebutton-wrapper" v-bind:class="isactive ? 'togglebutton-checked' : ''">
                <label v-bind:for="name">
                <span class="togglebutton-label">{{ label }}</span>
                <span class="tooglebutton-box"></span>
                </label>
                <input v-bind:id="name" type="checkbox" v-bind:name="name" v-model="isactive" v-on:change="onToogle">
                </div>`,
                model: {
                    prop: 'checked',
                    event: 'change'
                },
                data: function () {
                    return {
                        isactive: false
                    }
                },
                methods: {
                    onToogle: function () {
                        this.$emit('clicked', this.isactive)
                    }
                }
            });

            var todolist = new Vue({
                el: '.bfw',
                data: {
                    newitem: '',
                    sortByStatus: false,
                    todo: [{
                        id: 1, label: "学.........完整代码请登录后点击上方下载按钮下载查看