Vue使用Element表格Table设置所有单元格内容居中对齐

为单个列的单元格设置居中对齐代码如下:

        <el-table-column
            prop="productInfo.productName"
            label="中文名"
            width="100"
            align="center"
        >
        </el-table-column>

需要设置el-table-column标签里面的属性设置为align="center"

但是如果有几十个列呢,都需要居中对齐的话 align="center"需要写几十个吗,这样的话代码重复的太多了。
那么如何解决上面的问题呢?
答案是使用table属性cell-style为所有单元格设置一样的 Style。
在这里插入图片描述代码如下:

<el-table
          :data="tableData"
          :cell-style="cellStyle"
      >
...
cellStyle({row, column, rowIndex, columnIndex}) {
      return {'text-align': 'center'};
    }

看下效果:

设置之前,所有内容默认是靠左对齐的
在这里插入图片描述设置之后,可以看到所有内容是居中对齐了。
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/271237.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

掌握JWT:解密身份验证和授权的关键技术

JSON Web Token 1、什么是JWT2、JWT解决了什么问题3、早期的SSO认证4、JWT认证5、JWT优势6、JWT结构Header 标头Payload 负载 Signature 签名 7、代码实现添加依赖生成Token认证token 8、工具类9、JWT整合Web10、拦截器校验11、网关路由校验12、解决多用户登录的问题13、客户端…

积水监测识别摄像机

积水监测识别摄像机是一种利用摄像技术来监测和识别道路、桥梁、隧道等区域积水情况的设备&#xff0c;它可以有效地提供实时的积水监测信息&#xff0c;帮助交通部门和相关单位及时采取应对措施&#xff0c;确保道路交通的畅通和人员安全。 积水监测识别摄像机通过安装在适当位…

如何使用支付宝沙箱环境支付并公网调用sdk创建支付单服务

文章目录 1.测试环境2.本地配置2. 内网穿透2.1 下载安装cpolar内网穿透2.2 创建隧道3. 测试公网访问4. 配置固定二级子域名4.1 保留一个二级子域名4.2 配置二级子域名5. 使用固定二级子域名进行访问 1.测试环境 MavenSpring bootJdk 1.8 2.本地配置 获取支付宝支付Java SDK,…

【深度学习-目标检测】03 - Faster R-CNN 论文学习与总结

论文地址&#xff1a;Faster R-CNN: Towards Real-Time ObjectDetection with Region Proposal Networks 论文学习 1. 摘要与引言 研究背景与挑战&#xff1a;当前最先进的目标检测网络依赖于 区域提议&#xff08;Region Proposals&#xff09;来假设目标的位置&#xff0c…

【Echarts】使用echarts和echarts-wordcloud生成词云图

一、下载echarts和echarts-wordcloud 地址&#xff1a;https://download.csdn.net/download/qq_25285531/88663006 可直接下载放在项目中使用 二、词云数据 词云数据是对象的格式&#xff0c;可以从后端获取&#xff0c;这里以下面数据为例 {"visualMap": 199,&…

Dash中的callback的使用 多input 6

代码说明 import plotly.express as pxmport plotly.express as px用于导入plotly.express模块并给它起一个别名px。这样在后续的代码中&#xff0c;你可以使用px来代替plotly.express&#xff0c;使代码更加简洁。 plotly.express是Plotly的一个子模块&#xff0c;用于快速创…

关于react

1.快速搭建开发环境 2.react渲染流程 3.1 jsx基础 概念 3.2 jsx基础 本质 3.3 jsx基础 jsx表达式 3.4 jsx基础 实现列表渲染 3.5 jsx基础 实现条件渲染 3.5 jsx基础 实现复杂的条件渲染 4. react中事件绑定 5.react组建基础使用 6.1 useState 6.2 useState修改状态的规则 7.基础…

Android 11.0 系统默认打开OEM解锁开关功能实现

1.前言 在11.0的系统rom定制化开发中,在9.0系统以后为了设备的安装,系统开始启用oem机制,所以在adb push文件就需要先oem解锁,然后才可以 进行相关操作,所以就需要默认打开oem解锁的开关,来方便oem解锁功能的实现 如图: 2.系统默认打开OEM解锁开关功能实现的核心类 pac…

《Git快速入门》Git分支

1.master、origin、origin/master 区别 首先搞懂git分支的一些名称区别&#xff1a; master &#xff1a; Git 的默认分支名字。它并不是一个特殊分支、跟其它分支完全没有区别。 之所以几乎每一个仓库都有 master 分支&#xff0c;是因为 git init 命令默认创建它&#xff0c…

web功能实例 - Canvas裁剪工具

嗯,手撸官方文档2天&#xff0c;发现没啥用&#xff0c;尤其是动画,那种计算出来的&#xff0c;根本想不到。因此学着学了抱着要做个东西的想法,去网上找相关案例,最终做出了这个裁剪工具。 PS :先说一下思路: 核心实现有3个canvas图层, 其中一个负责图片的预览。另外2个叠加到…

\r\n和缓冲区/进度条小程序

一 前置知识 带有\n就会立马刷新缓冲区&#xff0c;\r不会刷新缓冲区 刷新的2个场景: 1 ~fflush 缓冲区中存在\r或\n --> \r fflush --> 不换行的\n) 2 ~ 文件关闭自动刷新缓冲区 倒计时小程序0-9 倒计时小程序0-99

信号与线性系统翻转课堂笔记11——连续LTI系统频域分析

信号与线性系统翻转课堂笔记11——连续LTI系统频域分析 The Flipped Classroom11 of Signals and Linear Systems 对应教材&#xff1a;《信号与线性系统分析&#xff08;第五版&#xff09;》高等教育出版社&#xff0c;吴大正著 一、要点 &#xff08;1&#xff0c;重点&…

Java基础知识复习

目录 一、Java语言基础知识&#xff0c;包括面向对象编程、语法特性等 0、什么是面向对象编程&#xff1f; 1、基本语法&#xff1a; 2、变量和数据类型&#xff1a; 3、运算符和表达式&#xff1a; 4、控制结构&#xff1a; 5、函数和方法&#xff1a; 6、类和对象&#xff1a…

因吹斯汀!只需上传照片,GPT-4V精准识别食物的卡路里和摄入热量

健身和减肥的朋友有福啦&#xff01; 最近一篇文章探索了GPT-4V在膳食评估领域的强大能力&#xff0c;可以根据饮食图片精准判断食物的种类与重量&#xff0c;并给出营养成分的分析&#xff0c;包括碳水化合物、蛋白质、脂肪占比。 最最重要的是&#xff0c;它还能告诉我们这…

算法与数据结构--二叉搜索树与自平衡二叉搜索树

0.字典&#xff08;即c的map&#xff09; 注&#xff1a;字典的 "member运算" 指的是检查字典中是否存在某个特定的键的操作&#xff0c;即查询操作。 如果我们使用数组来实现字典/map&#xff0c;虽然使用二分法查询也可以达到logn&#xff0c;但是的话插入和删除太…

GPT每预测一个token就要调用一次模型

问题&#xff1a;下图调用了多少次模型&#xff1f; 不久以前我以为是调用一次 通过看代码是输出多少个token就调用多少次&#xff0c;如图所示&#xff1a; 我理解为分类模型 预测下一个token可以理解为分类模型&#xff0c;类别是vocab的所有token&#xff0c;每一次调用都…

Description:An attempt was made to call a method that does not exist.

错误信息 Description: An attempt was made to call a method that does not exist. The attempt was made from the following location: okio.Segment.writeTo(Segment.kt:169) The following method did not exist: kotlin.collections.ArraysKt.copyInto([B[BIII)[B T…

多行文本(多行字符串)中,如果每行文本前都有空格,各行文本前空格数最小为n,则删除每行文本前的n个空格。textwrap.dedent(多行字符串)

【小白从小学Python、C、Java】 【计算机等考500强证书考研】 【Python-数据分析】 多行文本(多行字符串)中&#xff0c; 如果每行文本前都有空格&#xff0c; 各行文本前空格数最小为n&#xff0c; 则删除每行文本前的n个空格。 textwrap.dedent(多行字符串) 请问以下代…

ES的安装和RestClient的操作

目录 初识elasticsearch 什么是elasticsearch elasticsearch的发展 Lucene的优缺点 elasticsearch的优势 倒排索引 es与mysql的概念对比 文档 索引 概念对比 架构 安装es 安装kibana 安装ik分词器 分词器 安装ik分词器 ik分词器的拓展和停用词典 操作索引库…

c语言中数据结构

一、结构体的由来 1. 数据类型的不足 C语言中&#xff0c;基本数据类型只有整型、字符型、浮点型等少数几种&#xff0c;无法满足复杂数据类型的需要。 2. 数组的限制 虽然数组可以存储多个同类型的数据&#xff0c;但是数组中的元素个数是固定的&#xff0c;无法动态地改变…