avue 表单大全示例代码

代码语言:html

所属分类:表单美化

代码描述:avue 表单大全示例代码

代码标签: 示例

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

<html>
<head>
    <meta charset="UTF-8">
    <!-- import CSS -->
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/element-ui.2.15.1.css">
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/avue.css">

</head>
<body>
    <div id="app">
        <el-row style="margin-bottom:20px">
            <el-radio-group v-model="sizeValue">
                <el-radio label="small">默认</el-radio>
                <el-radio label="medium">medium</el-radio>
                <el-radio label="small">small</el-radio>
                <el-radio label="mini">mini</el-radio>
            </el-radio-group>
        </el-row>
        <avue-form ref="form" v-model="obj" :option="option" @reset-change="emptytChange" @submit="submit">
            <template slot-scope="scope" slot="menuForm">
                <el-button @click="tip">自定义按钮</el-button>
            </template>
        </avue-form>
    </div>


    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/vue@2.6.1.js"></script>
    <!-- import JavaScript -->
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/element-ui.2.15.1.js"></script>

    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/avue.min.js"></script>
    <script>

        var DIC = {
            VAILD: [{
                label: '真',
                value: 'true'
            },
                {
                    label: '假',
                    value: 'false'
                }],
            SEX: [{
                label: .........完整代码请登录后点击上方下载按钮下载查看

网友评论0