ant-design 基礎格式

1 格式

<template>
    <div>
        <center><h1>這是·注冊頁面</h1></center>

        <a-form-item label="用戶名" v-bind="formlayout">
          <a-input v-model="username"/>
        </a-form-item >

        <a-form-item v-bind="buttonlayout"  >
        <a-button type="primary"  @click="submit">注冊</a-button>
        </a-form-item>

    </div>
</template>
<script type="text/javascript">
    export  default {
      data(){
        return{
        username:'',
          // 表單樣式
          formlayout:{
          //標簽
          labelCol:{
            xs:{span:24},
            sm:{span:8}
          },
            // 文本框
            wrapperCol:{
            xs:{span:24},
            sm:{span:16}
            }
          },
          // 按鈕樣式
          buttonlayout:{
          //標簽
          wrapperCol:{
            xs:{
              span:24,
              offset:0
            },
            sm:{span:16,offset:8}
          },
          }
        }
      }
</script>