通过el-table, 行动态样式,实现不动数据源, 静态检索数据

通过行动态样式, 实现不动数据源, 检索数据, 检索静态数据

<div class="sectino-box__action-box flex-box" >
	<span class="required-start">选择客户：</span>
	<div>
		<el-input
			v-model="branchSearchKey"
			size="mini"
			placeholder="输入关键字搜索客户"      style="width: 150px; margin-left: 10px;"
		/>
	</div>
</div>
	<el-table
		:data="baseForm.branchIds"
		max-height="400px"
		:row-class-name="branchRowClassName"
	>
		<el-table-column type="selection" width="50" align="center" fixed ></el-table-column>
		<el-table-column type="index" align="center" width="50" label="序号"></el-table-column>
		<el-table-column align="center" label="客户编码" prop="branchId"></el-table-column>
		<el-table-column align="center" label="客户名称" prop="branchName"></el-table-column>
		<el-table-column align="center" label="收货地址" prop="branchAddr"></el-table-column>
</el-table>

	methods: {
		branchRowClassName({ row }) {
			if (!this.branchSearchKey) {
				return '';
			}
			let json = JSON.stringify(row);
			return json.indexOf(this.branchSearchKey) !== -1 ? '' : 'hidden-row';
		},
	}

.hidden-row {
	display: none !important;
}