vue项目1-pizza点餐系统8-登陆和注册结构

<template>
    <!-- 设置行 -->
     <div class="row mt-3">
         <!-- 设置列 -->
         <div class="col-md-12 col-lg-12">
             <div class="card">
                 <div class="card-body"> 
                     <!-- mx-auto表示左右居中 -->
                     <img class="mx-auto d-block" src="../assets/icon.png" alt="">
                     <!-- @submit.prevent="onSubmit"表示设置默认事件 -->
                     <form @submit.prevent="onSubmit">
                         <div class="form-group">
                             <label for="email">邮箱</label>
                             <!-- 样式和数据绑定class="form-control"
                             v-model="email" -->
                             <input 
                             type="email"
                             class="form-control"
                             v-model="email"
                             >
                         </div>
                         <div class="form-group">
                             <label for="password">密码</label>
                             <input 
                             type="password"
                             class="form-control"
                             v-model="password"
                             >
                         </div>
                         <div class="form-group">
                             <label for="confirm-password">确认密码</label>
                             <input 
                             type="confirm-password"
                             class="form-control"
                             v-model="confirmPassword"
                             >
                         </div>
                         <button type="submit" class="btn btn-block success">注册</button>
                     </form>
                 </div>
             </div>
         </div>
     </div>
 </template>
 
 <script>
 export default {
     data(){
         return{
             email:'',
             password:'',
             confirmPassword:''
         }
     },
     methods:{
         onSubmit(){

         }
     }
 }
 </script>

  

猜你喜欢

转载自www.cnblogs.com/JimShi/p/11201623.html