vue二十三：图书管理器案例实现

实现效果
vue二十三：图书管理器案例实现
<!DOCTYPE html>
<html lang='en'>
<head>
    <meta charset='UTF-8'>
    <meta name='viewport' content='width=device-width, initial-scale=1.0'>
    <meta http-equiv='X-UA-Compatible' content='ie=edge'>
    <script src='../lib/vue.js'></script>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"
          integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
    <title>图书管理系统</title>
</head>
<body>
<div id='app'>
    <div class="container">
        <h1>图书管理系统</h1>
        <form class="form-inline">
            <div class="form-group">
                <label for="name">名称：</label>
                <input type="text" class="form-control" ,
                    price: 0
                }
            },
            // 删除操作
            del(index){
                this.books.splice(index,1)
            }
        },
        // 自定义过滤器，转换时间格式
        filters: {
            timeFormat: function(value){
                value = new Date(value)
                let year = value.getFullYear()
                let month = value.getMonth() + 1  // 默认月份是从0开始
                let day = value.getDate()
                let hour = value.getHours()
                let minute = value.getMinutes()
                return `${year}-${month}-${day} ${hour}:${minute}` // 模板字符串
            }
        }
    })
</script>
</body>
</html>