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