<el-table-column label="用户信息" align="left"> <template slot-scope="{ row }"> <div> 会员ID:{{ row.uid }}<el-link type="info" :underline="false" @click="subordinate(row.uid)">查看下级</el-link> </div> <p v-if="row.phone != ''">手机号:{{ row.phone }}</p> <p v-if="row.email != ''">邮箱:{{ row.email }}</p> <p v-if="row.area_code != ''">地区代码:{{ row.area_code }}</p> <p v-if="row.invitation_code != ''">邀请码:{{ row.invitation_code }}</p> <p v-if="row.register_time != ''">注册时间:{{ row.register_time }}</p> </template> </el-table-column>怎么让表头居中内容靠左对齐
时间: 2024-02-16 15:16:58 浏览: 78
你可以在 `el-table-column` 上设置 `header-align` 属性为 `center`,并在其中嵌套一个 `div` 元素,再将 `div` 元素中的内容设置为居左对齐,代码如下:
```
<el-table-column label="用户信息" align="left" header-align="center">
<template slot-scope="{ row }">
<div style="text-align: left;">
会员ID:{{ row.uid }}<el-link type="info" :underline="false" @click="subordinate(row.uid)">查看下级</el-link>
</div>
<p v-if="row.phone !== ''">手机号:{{ row.phone }}</p>
<p v-if="row.email !== ''">邮箱:{{ row.email }}</p>
<p v-if="row.area_code !== ''">地区代码:{{ row.area_code }}</p>
<p v-if="row.invitation_code !== ''">邀请码:{{ row.invitation_code }}</p>
<p v-if="row.register_time !== ''">注册时间:{{ row.register_time }}</p>
</template>
</el-table-column>
```
其中,`header-align="center"` 设置表头居中,`<div style="text-align: left;">` 设置内容居左对齐。
阅读全文