Vue -- Table中當沒有數據被選中時,刪除鍵不可用

html

<div style="width: 100%;margin-bottom:7px;margin-top:1px">
	<el-button icon="el-icon-plus" size="mini" :title="$t('btn.add')" @click="addAppTemplate"></el-button>
	<el-button icon="el-icon-delete" size="mini" :title="$t('btn.remove')" :disabled="deleteDisabled" @click="removeAppTemplate"></el-button>
</div>

<el-table :data="tableData" cell-style="padding:3px"  ref="multipleTable" border highlight-current-row:true  @selection-change="selectionChange"  >
		<el-table-column type="selection"  align="center" min-width="3"></el-table-column>
	    <el-table-column prop="appCategory" :label="$t('columns.appCategory')" align="center" sortable min-width="7"> </el-table-column>
		<el-table-column prop="version" :label="$t('columns.version')"  align="center" min-width="5" ></el-table-column>
</el-table>

js

deleteDisabled :true

this.methods = {
	addAppTemplate : function(row){
		var _self = this;
		_self.$router.push({path: "/addAppTemplate",params: {isAdd:true}});	
		top.navigatorTop.addBreadcrumbNode (_self.$t('breadcrumb.addAppTemplate'),null,null,null,true,function(){						 	
		_self.$router.push({path: "/addAppTemplate"});
		});
	},
	selectionChange : function(selection){
		if(selection.length >0){
			this.deleteDisabled = false;
		}else{
			this.deleteDisabled = true;
		}
	},
	removeAppTemplate : function(){
		var _self = this;
		var _appTemplateArr =_self.$refs.multipleTable.selection;
		var _appTemplateIdArr =[];
		for(i=0;i<_appTemplateArr.length;i++){
			_appTemplateIdArr.push(_appTemplateArr[i].id);
		}
		commonConfirm.show(commonConfirm.level.warn, _self.$t('tips.confirmRemove'),
			function(params) {
				$.ajax({
					url : path + '/test/testAction!removeAppTemplate.action',
					cache: false,
    				type : 'post',
					data : {
						appTemplateIds :  _appTemplateIdArr.toString()
					},
					success : function(data) {
						if(data == "error"){
							_self.$message({
	    				          showClose: true,
	    				          message: _self.$t('tips.removeFailed'),
	    				          type: 'error'
	    				        });
							return;
						}
						_self.getAppTemplateListTableData();
						_self.$message({
    				          showClose: true,
    				          message: _self.$t('tips.removeSuccess'),
    				          type: 'success'
    				        });
					},
					error : function(err) {
						_self.$message({
    				          showClose: true,
    				          message: _self.$t('tips.removeFailed'),
    				          type: 'error'
    				        });
					}
				});
		});
	},

}
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章