Vue Element-ui下拉使用

記錄一下element-ui的下拉框靈活用法

//頁面代碼   這個是table裏面的下拉
<template slot-scope="scope">
	   <el-select v-model="ruleId" placeholder="請選擇" clearable
	                                 @change="finldSource($event,scope.row)">
	                          <el-option v-for="items in scope.row.evationRuleBVOList" :key="items.value" :label="items.label" :value="items.value"></el-option>
	  </el-select>
 </template>

// 下拉框賦值
//spEvationUserScoreVO集合裏面有evationRuleBVOList集合(這個集合裏面的數據是下拉框所需要的)
for(var i=0; i<result.spEvationUserScoreVO.length; i++){
            let evationRuleBVOs = result.spEvationUserScoreVO[i].evationRuleBVOList;
            for(var j=0; j<evationRuleBVOs.length; j++){
              if(util.StringNotBlank(evationRuleBVOs[j].evationLabel)){
                result.spEvationUserScoreVO[i].evationRuleBVOList[j] = {label: evationRuleBVOs[j].evationLabel + "("+evationRuleBVOs[j].evationScore+"分)", value: evationRuleBVOs[j].id};
              } else {
                result.spEvationUserScoreVO[i].evationRuleBVOList[j].length = 0;
              }
            }
          }

主要是把從後端返回來的數據集合evationRuleBVOList當作的options來使用，重新把品拼接的數據放入集合讓集合變爲下拉框選項。
在table裏面使用下拉框，而且每行下拉框的數據還不一樣需要用到插槽,插槽在table裏面可以取到table的當前行數據。
當使用change事件有需要別的參數可以使用$event，不僅獲取change變動的值，後面還可以跟其他參數方便使用。

遇到問題暫且記錄。方便日後查看。