zoukankan      html  css  js  c++  java
  • iview表单语法

    html

     <Form :label-width="100" :rules="ruleValidate" :model="editInfo" ref="addNewForm">
                    <Row>
                        <Col span="24">
                       <Form-item prop="name" label="挂件名称">
                            <Input v-model="editInfo.name" style='250px;' placeholder="请输入挂件名称"/>
                        </Form-item>
                        </Col>
                        <br/>
                        <Col span="24">
                        <!-- <Input v-model="editInfo.type" hidden/> -->
                        <Form-item prop="type" label="挂件类型">
                            <Dropdown @on-click="handleType">
                                <a href="javascript:void(0)">
                                    {{editInfo.type? editInfo.type : '请选择挂件类型'}}
                                    <Icon type="ios-arrow-down"></Icon>
                                </a>
                                <DropdownMenu slot="list">
                                    <!-- <template > -->
                                        <DropdownItem :name='index' v-for='(item,index) in pendentList' :key='index'>{{item.item_name}}</DropdownItem>
                                    <!-- </template> -->
                                </DropdownMenu>
                            </Dropdown>
                        </Form-item>
                        </Col>
                    </Row>
                </Form>

    js

     data(){
           return{
                openAddNewModal:true,
                ruleValidate: {
                    name: { required: true, message: "请输入挂件名称" },
                    type: { required: true, message: "请输入挂件类型" }
                },
                editInfo:{
                    name:"",
                    type:""
                },
                pendentList:[]
           }
        },
        methods:{
            handlSave(){
                let validated = true;
                this.$refs.addNewForm.validate(valid => {
                    validated = validated && valid;
                });
                if (!validated) {
                    this.$Message.error("请填写完整的信息");
                    return;
                }
            },

     重置表单信息以及去除表单验证提示:

    this.$refs.addNewForm.resetFields();
  • 相关阅读:
    C# 后台调用webApi
    WebApi传参详解
    网络爬虫字体解密
    单元测试的简单实用
    JQuery中$.ajax()方法参数详解
    vscode HTML标签换行问题
    C#基础之Assembly 当前项目的程序集GetAssemblies
    RedisHelper
    vue setTimeout 和 this.$nextTick,BMap api
    excel 导出 OpenXml
  • 原文地址:https://www.cnblogs.com/ivan5277/p/12964680.html
Copyright © 2011-2022 走看看