美文网首页
数组去重以及第二次点击同一个按钮取消点击状态

数组去重以及第二次点击同一个按钮取消点击状态

作者: MGLMONSTER | 来源:发表于2019-10-18 17:49 被阅读0次
<FormItem prop="resources_type_id">

                                <template v-for="(item,index) in resourcesList">                                

                                   <Button @click="resourceTypeBtnClick(item)" 

                                      :key="index" 

                                      :type="item.status?'primary':'ghost'" 

                                       style="padding: 15px 2px;" shape="circle">

                                            <div style="writing-mode: vertical-lr;font-size: 20px;">

                                                {{item.label}}

                                            </div>

                                    </Button>

                                </template>

                                <Button v-show="resourcesList.length==0" shape="circle" disabled>

                                    <div style="writing-mode: vertical-lr;font-size: 20px;">

                                        {{$t('m.content_no')}}

                                    </div>

                                </Button>

                            </FormItem>

----------------methods--------------

// 资源类型按钮点击

            resourceTypeBtnClick(val){

                this.formValidate.resources_type_id.push(val.value);

                var temp = [];

                for(var i=0;i<this.formValidate.resources_type_id.length;i++){

                    if(temp.indexOf(this.formValidate.resources_type_id[i]) == -1){

                        temp.push(this.formValidate.resources_type_id[i]);

                        val.status = true;

                    }else{

                        val.status = false;

                        temp.splice(temp.indexOf(this.formValidate.resources_type_id[i]),1)

                    }

                }

                this.formValidate.resources_type_id = temp;

                console.log(this.formValidate.resources_type_id);

            },





// 获取资源类型

            resourcesData(){

                this.$http.get('api/resources/v1/resources/type/list')

                .then(val=>{

                    let datas = JSON.parse(JSON.stringify(val.data))

                    if(val.data.length>0){

                        this.resourcesList = []

                        val.data.forEach(el=>{

                            this.resourcesList.push({

                                value:el.id,

                                label:el.name.mn?el.name.mn:el.name_lang.zh,

                                status:false

                            })

                        })

                    }

                },err=>console.log(err))

            },

相关文章

网友评论

      本文标题:数组去重以及第二次点击同一个按钮取消点击状态

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