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='width: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;
            }
        },