vue项目遇到的那些坑

项目使用iview 2.0 + vue 2.0

 

1、select

（1）单选，value值为数字时， 表单验证时要加 type: 'number'  

this.$refs.selectedDevice.clearSingleSelect();    清空单选项，仅在 clearable="true" 时有效

（2）多选， 要加  type: 'array'

// value值为数字
<FormItem prop="name" label="设备名称">
    <Select filterable clearable v-model="form1.name" ref="selectedDevice" @on-change="selectDevice">
        <Option v-for="item in devicesData" :value="item.switchId" :key="item.switchId">{{item.switchName}}({{item.switchIpAddress}})</Option>
    </Select>
</FormItem>

// value值为字符串
<FormItem prop="port" label="端口">
    <Select filterable clearable v-model="form.port" ref="selectPort">
        <Option v-for="item in partInfo" :value="item.total_rate" :key="item.id">{{item.id}}</Option>
    </Select>
</FormItem>

<FormItem prop="LinksGroup" label="链路成员">
    <Select v-model="form1.LinksGroup" multiple style="width:480px">
        <Option v-for="item in partInfo" :value="item.linkEtherName" :key="item.linkEtherName">{{item.linkEtherName}}</Option>
    </Select>
</FormItem>

form1: {           
    name: null,  // 设备id
    port: "",
    LinksGroup: []
},
rules1: {
    name: [{ type: 'number', required: true, message: "请选择设备", trigger: "change" }],
    port: [{ required: true, message: "请选择端口", trigger: "change" }],
    LinksGroup: [{ type: 'array', required: true, message: "请选择链路成员", trigger: "change" }]
}