ant-design-vue form-model表单集合效果代码

代码语言:html

所属分类:表单美化

代码描述:ant-design-vue form-model表单集合效果代码

代码标签: 集合 效果

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">

</head>
<body>
    <div id="app">
        <a-form-model :model="form" :label-col="labelCol" :wrapper-col="wrapperCol">
            <a-form-model-item label="Activity name">
                <a-input v-model="form.name" />
            </a-form-model-item>
            <a-form-model-item label="Activity zone">
                <a-select v-model="form.region" placeholder="please select your zone">
                    <a-select-option value="shanghai">
                        Zone one
                    </a-select-option>
                    <a-select-option value="beijing">
                        Zone two
                    </a-select-option>
                </a-select>
            </a-form-model-item>
            <a-form-model-item label="Activity time">
                <a-date-picker
                    v-model="form.date1"
                    show-time
                    type="date"
                    placeholder="Pick a date"
                    style="width: 100%;"
                    />
            </a-form-model-item>
            <a-form-model-item label="Instant delivery">
                <a-switch v-model="form.delivery" />
            </a-form-model-item>
            <a-form-model-item label="Activity type">
                <a-checkbox-group v-model="form.type">
                    <a-checkbox value="1" name="type">
                        Online
                    </a-checkbox>
                    <a-checkbox value="2" name="type">
                        Promotion
                    </a-checkbox>
                    <a-checkbox value="3" name="type">
                        Offline
                    </a-checkbox>
                </a-checkbox-group>
            </a-form-model-item>
            <a-form-model-item label="Resources">
                <a-radio-group v-model="form.resource">
                    <a-radio value="1">
        .........完整代码请登录后点击上方下载按钮下载查看

网友评论0