TypeError: data.includes is not a function

错误原因：数据类型错误

后端传入的数据是 Page<实体类对象>，所以前端获取到data数据后需要data.records才可以获取到实体类对象集合。

前端使用：

<el-form :model="searchFormState" ref="searchFormRef" name="advanced_search" class="ant-advanced-search-form">
	<el-row :gutter="24">
		<el-col :span="6">
			<el-form-item label="用户名" name="account">
				<el-input v-model="searchFormState.account" placeholder="请输入用户名"/>
			</el-form-item>
		</el-col>
		<el-col :span="6">
			<el-button type="primary" @click="loadData()">查询</el-button>
			<el-button style="margin: 0 8px" @click="reset()">重置</el-button>
		</el-col>
	</el-row>
</el-form>

<el-table
	ref="table"
	:data="tableData"
	style="width: 100%"
>
	<el-table-column type="index" label="序号" width="150" align="center"></el-table-column>
	<el-table-column prop="account" label="用户名" width="180" align="center"></el-table-column>
	<el-table-column prop="status" label="状态" width="220" align="center" key="canLogin">
		<template #default="scope">
			<div v-if="scope.row.status=== 'YES'">xxx</div>
			<div v-else-if="scope.row.status=== 'NO'">yyy</div>
		</template>
	</el-table-column>
	<el-table-column label="操作" align="center">
		<template #default="scope">
			<el-button type="primary" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
			<el-button type="danger" @click="handleDel(scope.$index, scope.row)">删除</el-button>
		</template>
	</el-table-column>
</el-table>

JS中：

<script>
import xApi from '@/api/x/x'
export default {
	name: 'Institution',
	computed: {
	},
	data() {
		return {
			searchFormState: {
				account: '',
				type: 'INSTITUTION'
			},
			tableData: []
		}
	},
	mounted() {
		this.loadData()
	},
	methods: {
		loadData() {
			xApi.page(this.searchFormState).then((data) => {
				console.log(data)
				this.tableData = data.records
			})
		},
        reset() {
			this.searchFormState.account = ""
		}
	}
}
</script>