首页 > 解决方案 > MDB DataTable text-align on th 和 td 在 ReactJS

问题描述

我正在使用mdbreact这样的方式在 reactjs 中生成一个可排序的表

import React from 'react';
import { MDBDataTable } from 'mdbreact';

const tableData = {
    columns: [
        {
            field: 'first_name',
            label: 'First Name'
        },
        {
            field: 'last_name',
            label: 'Last Name'
        },
        {
            field: 'age',
            label: 'Age'
        }
    ],
    rows: [
        {
            first_name: 'John',
            last_name: 'Smith',
            age: 29
        },
        {
            first_name: 'Jane',
            last_name: 'Doe',
            age: 37
        }
    ]

class Table extends React.Component {
    render() {
        return(
            <MDBDataTable data={tableData} />
        )
    }
}

export default Table;

(以上是我正在使用的表格的简化)

目前我正在使用类似于下面的东西来定位thcss中的前5个元素:

th:nth-of-type(-n+5) {
    text-align: left;
}

但是有没有办法通过列或单元格应用某种类别或在 js 级别应用样式?

具体来说,我想将一个类应用于年龄 thtd元素,无论它们可能位于列顺序中的任何位置

标签: reactjsdatatablesmdbootstrap

解决方案


推荐阅读