vue 显示更多，收起功能

话不多说，直接上代码

html

<div class="listgoods-right-flex"> 
		 <div class="content">
				 <span class="item"  v-for="(item,index) in supplierList" :key="index"
		  v-if="index <= tagBtnListLength">{{item.name}}</span>
		 </div>
				 <div class="more" @click="showMore" v-if="supplierList.length > 3">
		 {{showBtnTags ?'更多' : '收起'}} 
		 <i :class="showBtnTags ? 'el-icon-arrow-down': 'el-icon-arrow-up'"></i>
		 </div>
</div>

js

	tagBtnListLength: 3,
    showBtnTags: true,
	supplierList:[
				{name:'川唯石化1',key:1},
				{name:'川唯石化2',key:2},
				{name:'川唯石化3',key:3},
				{name:'川唯石化4',key:4},
				{name:'川唯石化5',key:5},
			]
	// 展开收起
		showMore() {
			if (!this.showBtnTags) {
				this.tagBtnListLength = 3;
			} else {
				this.tagBtnListLength = this.supplierList.length;
			}
			this.showBtnTags = !this.showBtnTags;
    	}