<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>09组件化开发todolist</title>
<link rel="stylesheet" href="./assets/bootstrap.css">
</head>
<body>
<h1>09组件化开发todolist</h1>
<div id="app">
<todolist></todolist>
</div>
<template id="todolist">
<div class="container">
<todo-head @add="addItem"></todo-head>
<todo-body v-bind:datalist="list" :complete="completeItem"></todo-body>
</div>
</template>
<template id="todoHead">
<div class="input-group mb-3">
<input type="text" class="form-control" ref="input" v-model="todo" v-on:keyup.enter="addItem">
<button class="btn btn-success" v-on:click="addItem">添加</button>
</div>
todolist待办事件组件开发
最新推荐文章于 2024-07-22 15:19:55 发布