其他分享
首页 > 其他分享> > ElememtUI使用记录

ElememtUI使用记录

作者:互联网

一、el-select组件
1、选中时传递value和label(转载于https://blog.csdn.net/qq_41149508/article/details/93191038)

<template>
      <!--单选-->
     <el-select v-model="activeName"  placeholder="选择活动"  class="wv100 mt-10" clear  filterable @change="choseActive">
         <el-option v-for="item in optionsActivity" :key="item.ArticleID" :label="item.ArticleTitle" :value="item.ArticleID"></el-option>
     </el-select>
        <!--多选-->
     <el-select v-model="activeName2" multiple  filterable  placeholder="选择活动"  class="wv100 mt-10" clear @change="choseActive2">
         <el-option v-for="item in optionsActivity" :key="item.ArticleID" :label="item.ArticleTitle" :value="item.ArticleID"></el-option>
     </el-select>
 </template>
 <script>
     export default({
            data(){
                activeName:"",
                activeName2:"",
                 optionsActivity:[
                      {ArticleID:0,ArticleTitle:"活动一"},
                      {ArticleID:1,ArticleTitle:"活动二"},
                      {ArticleID:2,ArticleTitle:"活动三"},
                      {ArticleID:3,ArticleTitle:"活动四"},
                  ],
                  selected:[],//多选选中的数据       
            },
            methods:{
                    //单选情况
                      choseActive(e){
                            let obj = {};
			                obj = this.optionsAdvance.find((item)=>{
			                    return item.ArticleID === e;
			                });
                      },
                     //多选情况
                     chooseActive2(e){
                           this.selected= [];
		                    for(let i = 0; i < this.activeName2.length; i++){
		                        let obj = this.optionsActivity.map((item) => {
		                            var object  = new Object();
		                            if(item.ArticleID ===  this.activeName2[i]){
		                                object.ArticleID = item.ArticleID ;
		                                object.ArticleTitle= item.ArticleTitle;
		                                this.selected.push(object)
		                            }           
		                        })
		                    }
                     }
            }
     })
</script>

2、选中时传递一整个选项 以及重定义ElememtUI方法

 <el-form-item  size="small">
 <a   href="#"slot="label"style="text-decoration:none;color:black;">产品</a >
 <el-select  v-model="model.ProductId__Item.FNumber"   
  	 filterable
     remote
     value-key="MaterialId"    
     placeholder="请输入关键词"
  :remote-method="(query) => remoteMethod(query,'522f14c0001d14ab')" 
  @change="(value)=>{LookupSelected(value,'ProductId__Item','522f14c0001d14ab','ProductId','MaterialId')}"
    :loading="loading">
    <el-option  v-for="item in Array"      
		     :key="item.MaterialId"     
		     :label="item.FNumber"    
		     :value="item" >   
      </el-option>
  </el-select>
    </el-form-item>

二、日期 (转载于https://blog.csdn.net/qq_41149508/article/details/93191038)
三、Steps 步骤条 (转载于https://blog.csdn.net/qq_41149508/article/details/93191038)

标签:obj,记录,object,item,ElememtUI,ArticleID,使用,ArticleTitle,let
来源: https://blog.csdn.net/qq_37573226/article/details/104835114