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

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

        <el-table-columnprop="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'};}

看下效果:

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

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

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

十大VSCODE 插件推荐2023

1、海鲸AI 插件链接&#xff1a;ChatGPT GPT-4 - 海鲸AI - Visual Studio Marketplace 包含了ChatGPT(3.5/4.0)等多个AI模型。可以实现代码优化&#xff0c;代码解读&#xff0c;代码bug修复等功能&#xff0c;反应迅捷&#xff0c;体验出色&#xff0c;是一个多功能的AI插件…

剩余电流动作保护器在农林灌溉中的重要性

正确认识和对待剩余电流动作保护器&#xff08;以下简称保护器&#xff09;的重要性及其作用&#xff0c;科学地选择、检定、配置、装设和使用保护器&#xff0c;加强和完善其维护管理&#xff0c;对于强化农网安全用电、预防触电伤亡事故都将会起到事半功倍的效果。1联5系8电2…

【MYSQL】Mysql索引详解

MySQL索引 MySQL索引1.什么是索引&#xff1f;2.索引的优缺点3.索引的分类&#xff08;四大分类 面试必问&#xff09;4.索引的创建和删除4.1主键索引的创建4.2.单列索引的创建4.3唯一索引的创建4.4.复合索引的创建4.5.删除索引4.6.总结索引 5.索引的底层原理&#xff08;索引的…

计算机专业自学网站大全,零基础入门到精通

分享32个鲜为人知并且完全免费的高质量自学网站&#xff0c;每个都是堪称神器&#xff0c;让你相见恨晚。 1&#xff1a;Oeasy 是一个完全免费的综合视频教程网站&#xff0c;非常良心实用。 它提供的视频教程非常丰富并且质量很高&#xff0c;包括&#xff1a;PS 教程、手机…

SpringBoot定时监听RocketMQ的NameServer

问题分析 自己在测试环境部署了RocketMQ&#xff0c;发现namesrv很容易挂掉&#xff0c;于是就想着监控&#xff0c;挂了就发邮件通知。查看了rocketmq-dashboard项目&#xff0c;发现只能监控Broker&#xff0c;遂放弃这一路径。于是就从报错的日志入手&#xff0c;发现最终可…

学生用的护眼台灯什么牌子好?无款好用护眼台灯推荐

随着现在小孩子的近视率越来越高&#xff0c;全国中小学生近视比率占大多数&#xff0c;许多家长也开始为孩子的健康成长而担忧&#xff0c;这时很多家长就会选择护眼台灯来为孩子保驾护航。但面对市面上五花八门的台灯品牌&#xff0c;各式各样的台灯许多家长却乱了阵脚&#…

汽车项目管理

项目节点&#xff1a; MR (Management Review)——管理层评审 KO (Kick Off)——项目正式启动 SI (Strategy Intent)——战略意图 SC (Strategy Confirmation)——战略确认 PA (Program Approval)——项目批准 PR (Product Readiness)——产品就绪 VP (Verification Prototype)…

继电器负载的使用方法有哪些?

继电器是通过电磁效应或电热效应实现电路的自动开关。继电器负载是指继电器所控制的负载&#xff0c;通常包括电机、灯泡、加热器等。正确使用继电器负载可以确保设备的正常运行和安全。以下是一些使用继电器负载的方法&#xff1a; 选择合适的继电器&#xff1a;根据负载的类型…

Java经典框架之Spring MVC

Spring MVC Java 是第一大编程语言和开发平台。它有助于企业降低成本、缩短开发周期、推动创新以及改善应用服务。如今全球有数百万开发人员运行着超过 51 亿个 Java 虚拟机&#xff0c;Java 仍是企业和开发人员的首选开发平台。 课程内容的介绍 1. Spring MVC 入门案例 2. 基…

麒麟V10arm桌面版的安装包在麒麟V10服务器版安装

安装过后&#xff0c;可执行程序可能运行不了&#xff0c;看起来就像没识别为可执行程序。在终端运行&#xff0c;会发现其实是缺少了某些库&#xff0c;比如libicui18n.so.66、libicuuc.so.66、libicudata.so.66和libm.so.6库版本不对。 报这个错&#xff1a;error while loa…

强化学习_06_pytorch-TD3实践(CarRacing-v2)

0、TD3算法原理简介 详见笔者前一篇实践强化学习_06_pytorch-TD3实践(BipedalWalkerHardcore-v3) 1、CarRacing环境观察及调整 Action SpaceBox([-1. 0. 0.], 1.0, (3,), float32)Observation SpaceBox(0, 255, (96, 96, 3), uint8) 动作空间是[-1~1, 0~1, 0~1]&#xff0c…

Java新纪元:一探JDK 15的全新特性

欢迎来到我的博客&#xff0c;代码的世界里&#xff0c;每一行都是一个故事 Java新纪元&#xff1a;一探JDK 15的全新特性 前言Sealed ClassesSealed Classes的基本概念&#xff1a;Sealed Classes的优势&#xff1a;使用Sealed Classes的示例&#xff1a;注意事项&#xff1a;…