首页 > 解决方案 > 我如何有条件地在材料表中设置一行

问题描述

我想根据一行的某个道具对行进行样式设置,这里是代码:

    <MaterialTable
      className="ciao"
      title="One Detail Panel Preview"
      columns={[
        {title: "Icon", field: "icon"},
        { title: 'ID', field: 'id' },
        { title: 'Name', field: 'name' },
        { title: 'Surname', field: 'surname' },
        { title: 'Value', field: 'birthYear', type: 'numeric' },
        {
          title: 'Birth Place',
          field: 'birthCity',
          lookup: { 34: 'İstanbul', 63: 'Şanlıurfa', 45: "Genova" },  
        },
      ]}
      data={[
        { icon: <AccessAlarmIcon />,id:0, name: 'Andrea', surname: 'Castello', birthYear: 1987, birthCity: 63 },
        { id:1,name: 'Francesco', surname: 'Giostra', birthYear: 1987, birthCity: 63 },
        { id:2,name: 'Pietro', surname: 'Casa', birthYear: 1987, birthCity: 63 },
        { id:3,name: 'Giulio', surname: 'Villa', birthYear: 1987, birthCity: 34 },
        { id:4,name: 'Paolo', surname: 'Baran', birthYear: 1987, birthCity: 63 },
        { id:5,name: 'Mehmet', surname: 'Tazza', birthYear: 1987, birthCity: 45 },
          
      ]}
      detailPanel={rowData => {

        return (
          <div>Ehi ciao</div>
        )
      }}
      options={{
        actionsColumnIndex: -1,
        selection: true,
        sorting: true,
        rowStyle: {
          background: 'linear-gradient(to right, #fdf32e 0%, #ffffff 2%)',
        }
      }}
      onSelectionChange={(rows) => alert('You selected ' + rows.length + ' rows')}
    />

例如,如果名称是 Pietro,我希望背景为红色。

感谢您的帮助:D

标签: reactjsmaterial-uimaterial-table

解决方案


推荐阅读