element ui 中el-button按钮,根据不同数据改变按钮type即显示颜色

在这里插入图片描述

例一:

html:

   <el-button
        :type ="buttonType(item)"
        plain
        v-for="(item, index) in btnsArr"
        :key="index"
        @click="runBtnEvent(item,index)"
    >${ item.label }
    </el-button>

JS:

        methods:{
            buttonType(val){
                if(val.flag == "1"){
                    return "primary"
                }
                else{
                    return "info"
                }
            },

            runBtnEvent(btn,index) {
                var that = this;
            },
       }     
                

例二:

**html**
<el-button :type="buttonType(val)">按钮1</el-button>
<el-button :type="buttonType(val)">按钮2</el-button>

js:

  methods:{
    buttonType(val){
     if(val=="success"){
       return "primary"
     }
     if(val=="failure"){
       return "danger"
     }
 
   }
 }
Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐