码迷,mamicode.com
首页 > 其他好文 > 详细

vue使用select间相互绑定

时间:2020-07-21 21:30:41      阅读:68      评论:0      收藏:0      [点我收藏+]

标签:options   v-model   div   rod   created   for   获取值   lse   orm   

    

让这两个select相互绑定,让roleOptions选取值后,worklist弹出得是roleOptions值

<el-select v-model="postForm.projectName" placeholder="请选择" @change="getList(postForm)">
<el-option
  v-for="item in roleOptions"
  :key="item.key"
  :label="item.label"
  :value="item.key">
</el-option>
<el-select v-model="postForm" placeholder="请选择" value-key="id" @change="getList2(postForm)">
<el-option
  v-for="item in worklist"
  :label="item.productName"
  :value="item">
</el-option>
首先在created里面获取值,设res为null,传入getlist中;
async created() {
this.lastWorklist = await api_price_list({},this.queryParam);
let res = null;
this.getList(res)
},
然后在methods中进行判断
methods: {
  async getList(res) {
  this.listLoading = true
  如果res为null获取worklist
   if(res != null){
     this.worklist = [];
   如果res里面的获取数据为s或y则绑定不同的值
    if(res.projectName == "s"){
      this.lastWorklist.data.list.forEach(item => {
      if(item.app == res.projectName){
      this.worklist.push(item);
      }
     });
    }
 else if(res.projectName == "y"){
  this.lastWorklist.data.list.forEach(item => {
  if(item.app == res.projectName){
  this.worklist.push(item);
  }
  });
  }
 }
this.listLoading = false
},
然后在getlist2里面在第二个select组件进行传值绑定
getList2(res){
  if(res.app=="s"){
     this.postForm.projectName = "抖音";
  }
  else if(res.app == "y"){
    this.postForm.projectName = "快手";
  }
},

vue使用select间相互绑定

标签:options   v-model   div   rod   created   for   获取值   lse   orm   

原文地址:https://www.cnblogs.com/jiyingaoshou/p/13355312.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!