diff --git "a/\351\273\204\344\270\275\350\212\263vue\344\275\234\344\270\232/2022-03-29vue\347\254\254\344\270\200\346\254\241\344\275\234\344\270\232/demo01.html" "b/\351\273\204\344\270\275\350\212\263vue\344\275\234\344\270\232/2022-03-29vue\347\254\254\344\270\200\346\254\241\344\275\234\344\270\232/demo01.html"
new file mode 100644
index 0000000000000000000000000000000000000000..c51571fe3f85b95c483ed683fee4c8642d0ea1c5
--- /dev/null
+++ "b/\351\273\204\344\270\275\350\212\263vue\344\275\234\344\270\232/2022-03-29vue\347\254\254\344\270\200\346\254\241\344\275\234\344\270\232/demo01.html"
@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
+    <title>vue第一次作业</title>
+</head>
+
+<body>
+    <div>
+        <p>{{meg}}</p>
+        <span>{{megs}}</span>
+        <ul>
+            <li>{{ul}}</li>
+            <li>{{li}}</li>
+            <li>{{li1}}</li>
+        </ul>
+        <dl>
+            <dt>{{dt}}</dt>
+            <dd>{{dd}}</dd>
+        </dl>
+    </div>
+
+</body>
+<script>
+    let vm = new Vue({
+        el: 'div',
+        data: {
+            meg: 'hello vue',
+            megs: 'vue',
+            ul: '今天',
+            li:"天气",
+            li1:'挺好',
+            dt:'水果',
+            dd:'桃子'
+            
+        }
+    })
+</script>
+
+</html>
\ No newline at end of file
diff --git "a/\351\273\204\344\270\275\350\212\263vue\344\275\234\344\270\232/2022-03-29vue\347\254\254\344\270\200\346\254\241\344\275\234\344\270\232/demo02.html" "b/\351\273\204\344\270\275\350\212\263vue\344\275\234\344\270\232/2022-03-29vue\347\254\254\344\270\200\346\254\241\344\275\234\344\270\232/demo02.html"
new file mode 100644
index 0000000000000000000000000000000000000000..5299bb7eb72c4e05ec11e483f16c812eed1f1b37
--- /dev/null
+++ "b/\351\273\204\344\270\275\350\212\263vue\344\275\234\344\270\232/2022-03-29vue\347\254\254\344\270\200\346\254\241\344\275\234\344\270\232/demo02.html"
@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
+    <title>Document</title>
+</head>
+
+<body>
+    <div id="el">
+        <h3>输入您想输入的内容：<br>{{name}}</h3>
+        <input type="text" v-model="name"><br>
+        <span v-bind:title='span'>悬停在这里有神奇的事情发生</span>
+        <p v-if='p'>现在你看不见我</p>
+        <!-- v-model输出name内容 -->
+        <!-- v-bind悬停可出现其他自定义内容 缩写 ： -->
+
+    </div>
+</body>
+<script>
+    let vm = new Vue({
+        el: "#el",
+        data: {
+            name: "",
+            span:'你是猪 ^(*￣(oo)￣)^ ',
+            p:true
+        }
+
+    })
+
+</script>
+
+</html>
\ No newline at end of file
diff --git "a/\351\273\204\344\270\275\350\212\263vue\344\275\234\344\270\232/2022-03-30vue\347\254\254\344\272\214\346\254\241\344\275\234\344\270\232/demo01.html" "b/\351\273\204\344\270\275\350\212\263vue\344\275\234\344\270\232/2022-03-30vue\347\254\254\344\272\214\346\254\241\344\275\234\344\270\232/demo01.html"
new file mode 100644
index 0000000000000000000000000000000000000000..14cee6792b23dba4d3fdead814add7e9d60d59ed
--- /dev/null
+++ "b/\351\273\204\344\270\275\350\212\263vue\344\275\234\344\270\232/2022-03-30vue\347\254\254\344\272\214\346\254\241\344\275\234\344\270\232/demo01.html"
@@ -0,0 +1,61 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
+    <title>Document</title>
+</head>
+
+<body>
+    <div id="el">
+        <div>{{massage}}</div>
+        <span v-bind:title='tit'>鼠标悬停几秒有惊喜</span>
+        <p v-if='seen'>现在你看到我了（ps：改为false您将看不见我）</p>
+        <ol>
+            <li v-for="todo in todos">{{todo.text}}</li>
+            <!-- v-for 指令可以绑定数组的数据来渲染一个项目列表： -->
+            <!-- 在控制台输入vue.todos.push({text："输入你需要的内容"})会在末尾增加 -->
+        </ol>
+        <P> {{message}}</P>
+        <button v-on:click="cli">点击这里有不一样的变化</button>
+        <p>{{meg}}</p>
+        <input v-model='meg'>
+        <div v-bind:disabled='dis'>显示与不显示</div>
+        <button v-bind:disabled="dis">显示</button>
+        <div v-html='html'>html</div>
+        <button v-on:click="click">点击这里有惊喜🎁</button>
+    </div>
+</body>
+<script>
+    let data = {
+        massage: "我在这里！！",
+        tit: '你是猪🐖^(*￣(oo)￣)^',
+        seen: true,
+        todos: [
+            { text: '今天天气下雨' },
+            { text: '明天也许也下雨' },
+            { text: "后天也许还下雨" }
+        ],
+        message: "今天中午吃什么",
+        meg:"今天开心吗？",
+        dis:'true',
+        html:'<span style="color:red">我是html</span>',
+
+    }
+    let vue = new Vue({
+        el: '#el',
+        data: data,
+        methods: {
+            cli: function () {
+                this.message = this.message.split('').reverse().join('')
+            },
+            click:function(){
+                alert('今天的你真好看~~~///(^v^)\\\~~~')
+            }
+        }
+    })
+</script>
+
+</html>
\ No newline at end of file
diff --git "a/\351\273\204\344\270\275\350\212\263vue\344\275\234\344\270\232/2022-03-31Vue\347\254\254\344\270\211\346\254\241\344\275\234\344\270\232/imgs/1.jpg" "b/\351\273\204\344\270\275\350\212\263vue\344\275\234\344\270\232/2022-03-31Vue\347\254\254\344\270\211\346\254\241\344\275\234\344\270\232/imgs/1.jpg"
new file mode 100644
index 0000000000000000000000000000000000000000..9e329bcfe2c5b1f7feb10d954d9d44bce3a9efaf
Binary files /dev/null and "b/\351\273\204\344\270\275\350\212\263vue\344\275\234\344\270\232/2022-03-31Vue\347\254\254\344\270\211\346\254\241\344\275\234\344\270\232/imgs/1.jpg" differ
diff --git "a/\351\273\204\344\270\275\350\212\263vue\344\275\234\344\270\232/2022-03-31Vue\347\254\254\344\270\211\346\254\241\344\275\234\344\270\232/login.html" "b/\351\273\204\344\270\275\350\212\263vue\344\275\234\344\270\232/2022-03-31Vue\347\254\254\344\270\211\346\254\241\344\275\234\344\270\232/login.html"
new file mode 100644
index 0000000000000000000000000000000000000000..f01ae912fe54cd1230ad4aaef8c1f6e816a8356c
--- /dev/null
+++ "b/\351\273\204\344\270\275\350\212\263vue\344\275\234\344\270\232/2022-03-31Vue\347\254\254\344\270\211\346\254\241\344\275\234\344\270\232/login.html"
@@ -0,0 +1,102 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
+    <title>用户登入</title>
+</head>
+<style>
+    body {
+        /* background: linear-gradient(to right, #f78fad, #fdeb82); */
+        background-image: url(./imgs/1.jpg);
+        background-repeat: no-repeat;
+        background-size: 100%;
+    }
+    /* #main {
+        width: 300px;
+        height: 300px;
+        background-color: white;
+        border-radius: 15px;
+        margin-top: 5%;
+        margin-left: 10%;
+    } */
+    
+    #main {
+        margin-left: 70%;
+    }
+    
+    p {
+        padding-top: 10px;
+        margin-left: 40px;
+    }
+    
+    button {
+        margin-top: 15px;
+        margin-left: 105px;
+    }
+    
+    form {
+        margin-left: 15px;
+    }
+    
+    input {
+        margin-top: 5px;
+    }
+    
+    #header {
+        width: 100%;
+        height: 100px;
+        background-color: antiquewhite;
+    }
+</style>
+
+<body>
+    <div id="bigbox">
+        <!-- <header id="header">
+
+        </header> -->
+        <div id="main">
+            <input type="button" v-on:click='click ' value="登入">
+
+
+
+            <!-- <p>登入</p> -->
+            <form action="" method="get" v-on:submit.prevent="submit" v-if="isshow">
+                输入手机号：<input type="tel" name="tel" required pattern='^(13[0-9]|14[5|7]|15[0|1|2|3|4|5|6|7|8|9]|18[0|1|2|3|5|6|7|8|9])\d{8}$'><br> 输入密码： <input type="password" name="password" id="input1" pattern="^[a-zA-Z]\w{5,17}$" placeholder="密码由大小写数字6位数组成"><br>                确认密码： <input type="password" id="input2" name="confirm">
+                <button>提交</button>
+            </form>
+        </div>
+    </div>
+</body>
+<script>
+    //     写一个注册页面，美观点，然后用vue   placeholder="请输入用户名"
+    //     进行渲染，要有手机号注册，要有密码，
+    //     确认密码，要进行 数据验证，手机格式验证，密码6位以上的验证
+    //     确认密码于密码一致性的验证
+    let data = {
+        isshow: false
+    }
+
+    let vm = new Vue({
+        el: '#main',
+        data: data,
+        methods: {
+            submit: function() {
+                if (document.getElementById('input1').value == document.getElementById('input2').value) {
+                    window.location.href = 'user.html'
+                }
+            },
+            click: function() {
+                this.isshow = !this.isshow
+                if (this.isshow) {
+
+                }
+            }
+
+        }
+    })
+</script>
+
+</html>
\ No newline at end of file
diff --git "a/\351\273\204\344\270\275\350\212\263vue\344\275\234\344\270\232/2022-03-31Vue\347\254\254\344\270\211\346\254\241\344\275\234\344\270\232/user.html" "b/\351\273\204\344\270\275\350\212\263vue\344\275\234\344\270\232/2022-03-31Vue\347\254\254\344\270\211\346\254\241\344\275\234\344\270\232/user.html"
new file mode 100644
index 0000000000000000000000000000000000000000..37e3ccc90d7b4e7a14ab76247c9c10aad562a33b
--- /dev/null
+++ "b/\351\273\204\344\270\275\350\212\263vue\344\275\234\344\270\232/2022-03-31Vue\347\254\254\344\270\211\346\254\241\344\275\234\344\270\232/user.html"
@@ -0,0 +1,110 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
+    <title>用户使用</title>
+</head>
+<style>
+    body {
+        background: linear-gradient(to right, #f78fad, #fdeb82);
+    }
+    
+    #el {
+        width: 400px;
+        height: 500px;
+        background-color: white;
+        border-radius: 15px;
+    }
+    
+    h3 {
+        color: yellow;
+    }
+</style>
+
+<body>
+    <h3>欢迎来到黄小厨私房菜</h3>
+    <div id="el">
+        <input v-model="meg" placeholder="输入人数" style="width: 60px;border-radius: 10px; margin-left: 10px;margin-top: 10px;">
+        <p>人数：{{meg}}</p>
+        <p>现在来选择您需要的食物</p>
+        <p>招牌菜系</p>
+        <input type="checkbox" id="ftq" value="御用佛跳墙" v-model='foods' name="food">
+        <label for='ftq'>御用佛跳墙</label>
+        <input type="checkbox" id="yylp" value="鸳鸯鹿排" v-model='foods' name="food">
+        <label for='yylp'>鸳鸯鹿排</label>
+        <input type="checkbox" id="lfss" value="龙凤三丝" v-model='foods' class="food">
+        <label for='lfss'>龙凤三丝</label>
+        <input type="checkbox" id="gfds" value="贵妃豆沙" v-model='foods' class="food">
+        <label for='gfds'>贵妃豆沙</label>
+        <input type="checkbox" id="xlrr" value="雪里鹿肉" v-model='foods'>
+        <label for='xlrr'>雪里鹿肉</label>
+        <input type="checkbox" id="hmyc" value="黄焖鱼翅" v-model='foods'>
+        <label for='hmyc'>黄焖鱼翅</label>
+        <input type="checkbox" id="lj" value="雍亲王府烧鹿筋" v-model='foods'>
+        <label for='lj'>雍亲王府烧鹿筋</label>
+        <input type="checkbox" id="hblj" value="荷包里脊" v-model='foods'>
+        <label for='hblj'>荷包里脊</label>
+        <input type="checkbox" id="ytr" value="樱桃肉" v-model='foods'>
+        <label for='ytr'>樱桃肉</label>
+        <input type="checkbox" id="bncf" value="百鸟朝凤" v-model='foods'>
+        <label for='bncf'>百鸟朝凤</label>
+        <input type="checkbox" id="jlb" value="鸡里蹦" v-model='foods'>
+        <label for='jlb'>鸡里蹦</label>
+        <input type="checkbox" id="ghyc" value="桂花鱼翅" v-model='foods'>
+        <label for='ghyc'>桂花鱼翅</label>
+        <p>甜品</p>
+        <input type="checkbox" id="zn" value="枣泥酥饼" v-model='foods'>
+        <label for='zn'>枣泥酥饼</label>
+        <input type="checkbox" id="sz" value="松子百合酥" v-model='foods'>
+        <label for='sz'>松子百合酥</label>
+        <input type="checkbox" id="gt" value="宫廷太后饼" v-model='foods'>
+        <label for='gt'>宫廷太后饼</label>
+        <input type="checkbox" id="hq" value="黄桥烧饼" v-model='foods'>
+        <label for='hq'>黄桥烧饼</label>
+        <input type="checkbox" id="mz" value="蜜汁蜂巢糕" v-model='foods'>
+        <label for='mz'>蜜汁蜂巢糕</label>
+        <input type="checkbox" id="xh" value="香滑芝麻糕" v-model='foods'>
+        <label for='xh'>香滑芝麻糕</label>
+        <input type="checkbox" id="xy" value="椰香糯米糍" v-model='foods'>
+        <label for='xy'>椰香糯米糍</label>
+        <p>酒水</p>
+        <input type="checkbox" id="jn" value="九酝春酒" v-model='foods'>
+        <label for='jn'>九酝春酒</label>
+        <input type="checkbox" id="hn" value="鹤年贡酒" v-model='foods'>
+        <label for='hn'>鹤年贡酒</label>
+        <input type="checkbox" id="zj" value="枣集美酒" v-model='foods'>
+        <label for='zj'>枣集美酒</label>
+        <input type="checkbox" id="yg" value="羊羔美酒" v-model='foods'>
+        <label for='yg'>羊羔美酒</label>
+
+        <br>
+        <br>
+        <br>
+
+        <span>已选择菜品:{{foods}}</span>
+
+    </div>
+</body>
+<script>
+    let data = {
+        foods: [],
+        meg: "",
+
+
+
+
+
+    }
+    let vm = new Vue({
+        el: '#el',
+        data: data,
+        methods: {
+
+        }
+    })
+</script>
+
+</html>
\ No newline at end of file
