diff --git "a/\345\210\230\347\207\225/21.6.21\346\267\273\345\212\240\346\214\211\351\222\256\346\267\273\345\212\240\345\210\240\351\231\244\346\214\211\351\222\256\345\210\240\351\231\244/\346\267\273\345\212\240\346\214\211\351\222\256\346\267\273\345\212\240\345\210\240\351\231\244\346\214\211\351\222\256\345\210\240\351\231\244.html" "b/\345\210\230\347\207\225/21.6.21\346\267\273\345\212\240\346\214\211\351\222\256\346\267\273\345\212\240\345\210\240\351\231\244\346\214\211\351\222\256\345\210\240\351\231\244/\346\267\273\345\212\240\346\214\211\351\222\256\346\267\273\345\212\240\345\210\240\351\231\244\346\214\211\351\222\256\345\210\240\351\231\244.html"
new file mode 100644
index 0000000000000000000000000000000000000000..689b7768ab298c94d88cd8c470139192f92329bf
--- /dev/null
+++ "b/\345\210\230\347\207\225/21.6.21\346\267\273\345\212\240\346\214\211\351\222\256\346\267\273\345\212\240\345\210\240\351\231\244\346\214\211\351\222\256\345\210\240\351\231\244/\346\267\273\345\212\240\346\214\211\351\222\256\346\267\273\345\212\240\345\210\240\351\231\244\346\214\211\351\222\256\345\210\240\351\231\244.html"
@@ -0,0 +1,47 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta charset="utf-8">
+		<title></title>
+	</head>
+	<body>
+		<div id="app">
+			<input  type="text" v-model="text"/><button v-on:click="add()">添加</button>
+			<button-add v-for="(item,index) in List"
+			:index="index"
+				v-bind:Listname="item">
+				</button-add>
+		</div>
+		<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
+		<script>
+			Vue.component('button-add', {
+				data: function() {
+					return {}
+				},
+				props:['Listname','index'],
+				template: `<ul>
+						<li>{{Listname}}<button @click="$parent.deleteitem(index)">删除</button></li>
+					</ul>`
+			});
+			let app = new Vue({
+				el:"#app",
+				data:{
+					text:'',
+					List:[
+						'吃饭',
+						'睡觉',
+						'打豆豆'
+					]
+				},
+				methods:{
+					add:function(){
+						this.List.push({name:this.text})
+					},
+					deleteitem:function(index){
+						this.List.splice(index,1)
+					}
+				}
+			});
+		</script>
+	</body>
+</html>
diff --git "a/\345\210\230\347\207\225/21.6.24\344\277\241\346\201\257\346\217\220\347\244\272\345\222\214\346\217\222\346\247\275\345\256\236\347\216\260\346\214\211\351\222\256/\346\217\220\347\244\272\344\277\241\346\201\257\346\241\206.html" "b/\345\210\230\347\207\225/21.6.24\344\277\241\346\201\257\346\217\220\347\244\272\345\222\214\346\217\222\346\247\275\345\256\236\347\216\260\346\214\211\351\222\256/\346\217\220\347\244\272\344\277\241\346\201\257\346\241\206.html"
new file mode 100644
index 0000000000000000000000000000000000000000..cebd1a0d98f17d219b8d322fc10287d6eba2bebd
--- /dev/null
+++ "b/\345\210\230\347\207\225/21.6.24\344\277\241\346\201\257\346\217\220\347\244\272\345\222\214\346\217\222\346\247\275\345\256\236\347\216\260\346\214\211\351\222\256/\346\217\220\347\244\272\344\277\241\346\201\257\346\241\206.html"
@@ -0,0 +1,54 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta charset="utf-8">
+		<title></title>
+		<style>
+			*{
+				margin: 0px;
+				padding: 0px;
+			}
+		</style>
+	</head>
+	<body>
+		<div id="app">
+			<!-- <co-tips>
+				<template v-slot:title>提示信息</template>
+				<template v-slot:message>增加评论成功</template>
+				<template v-slot:btn><button style="border: none; background-color: #ff9400;">关闭</button></template>
+			</co-tips> -->
+			<co-tips>
+				<template v-slot:title>确认信息</template>
+				<template v-slot:message>确认要删除吗？</template>
+				<template v-slot:btn>
+					<button  style="border: none; background-color: #ff9400;">确认</button>
+					<button  style="border: none; background-color: #ff9400;">取消</button>
+				</template>
+			</co-tips>
+		</div>
+		<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
+		<script>
+			Vue.component('co-tips', {
+				data: function() {
+					return {}
+				},
+				template: `	<div style=" width: 200px; margin: 0 auto;">
+					<div style="padding: 5px;border-bottom: 1px solid #ccc;background-color: #FF9400">
+						<slot name="title"></slot>
+					</div>
+					<div style="text-align: center;padding: 5px;">
+						<slot name="message"></slot>
+					</div>
+					<div style="text-align: center; padding: 5px;">
+						<slot name="btn"></slot>
+					</div>
+					</div>`
+			});
+			
+			let app=new Vue({
+				el:"#app",
+				data:{}
+			})
+		</script>
+	</body>
+</html>
diff --git "a/\345\210\230\347\207\225/21.6.24\344\277\241\346\201\257\346\217\220\347\244\272\345\222\214\346\217\222\346\247\275\345\256\236\347\216\260\346\214\211\351\222\256/\346\217\222\346\247\275\345\256\236\347\216\260\346\214\211\351\222\256.html" "b/\345\210\230\347\207\225/21.6.24\344\277\241\346\201\257\346\217\220\347\244\272\345\222\214\346\217\222\346\247\275\345\256\236\347\216\260\346\214\211\351\222\256/\346\217\222\346\247\275\345\256\236\347\216\260\346\214\211\351\222\256.html"
new file mode 100644
index 0000000000000000000000000000000000000000..2e09296b431ae3738de72cd183745c91f129181f
--- /dev/null
+++ "b/\345\210\230\347\207\225/21.6.24\344\277\241\346\201\257\346\217\220\347\244\272\345\222\214\346\217\222\346\247\275\345\256\236\347\216\260\346\214\211\351\222\256/\346\217\222\346\247\275\345\256\236\347\216\260\346\214\211\351\222\256.html"
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta charset="utf-8">
+		<title></title>
+	</head>
+	<body>
+		<div id="app">
+			<button-counter>
+				<template v-slot:but1>提交</template>
+				<template v-slot:but2>保存</template>
+				<template v-slot:but3>重置</template>
+			</button-counter>
+		</div>
+		<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
+		<script>
+			Vue.component('button-counter', {
+				data: function() {
+					return {
+						count: 0
+					}
+				},
+				template: `<div>
+					<button><slot name="but1"></slot></button>
+					<button><slot name="but2"></slot></button>
+					<button><slot name="but3"></slot></button>
+				</div>`
+			});
+			
+			let app=new Vue({
+				el:"#app",
+				data:{}
+			})
+		</script>
+	</body>
+</html>
