美文网首页
ant design vue 使用a-select设置默认值

ant design vue 使用a-select设置默认值

作者: CoderZb | 来源:发表于2022-01-22 08:27 被阅读0次

a-select中使用v-model即可。

\color{#FF00FF}{效果如下:}

image.png

\color{#FF00FF}{全部代码如下:}

<template>
  <div>
   <a-select v-model="cardAttr" placeholder='请选择账户类型' style='width: 230px'  @change='handleAccountTypeChange'>
    <a-select-option :value='item.id' v-for="(item,index) in cardType"  :key='index'>
                  {{item.name}}
     </a-select-option>
    </a-select>
  </div>
</template>

<script>
export default {
  data() {
    return {
     cardType:[{'id':"1",name:'私人账户'},{'id':"2",name:'公司账户'}],
     cardAttr:null,
    };
  },
methods:{
    handleAccountTypeChange(e){
      console.log('账户类型',e);
      this.cardAttr = e;
   },
  },
  mounted() {
    this.cardAttr = '2';
  }
};
</script>

<style>

</style>

相关文章

网友评论

      本文标题:ant design vue 使用a-select设置默认值

      本文链接:https://www.haomeiwen.com/subject/lipehrtx.html