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" }]
}