Reactjs 物料界面/表格如何自动换行一列文本？默认情况下使用省略号

默认情况下使用省略号，但我希望它自动换行。 非常感谢你！！！

我第一次使用MaterialUI框架，并在互联网上查看了一些案例。我查阅了官方文件，但还是不知道。也许我的方法错了

代码显示如下：

import {
  Table,
  TableBody,
  TableHeader,
  TableHeaderColumn,
  TableRow,
  TableRowColumn,
} from 'material-ui/Table';

getTable() {
    let rows = [];
    for(var i=0; i<this.state.tasksOnShow.length; i++){
      let row = this.state.tasksOnShow[i];
      rows.push(
        <TableRow key={"row"+row.planId}>
          <TableRowColumn>{row.level}</TableRowColumn>
          <TableRowColumn>{row.taskName}</TableRowColumn>
          <TableRowColumn>{row.owner}</TableRowColumn>
          <TableRowColumn>{row.taskType}</TableRowColumn>
          <TableRowColumn>{row.taskGroup}</TableRowColumn>
          <TableRowColumn>{row.projectTeam}</TableRowColumn>
          <TableRowColumn>{row.status}</TableRowColumn>
        </TableRow>
      );
    }
    let styles = {
      tdStyle1:{
        width: "5%"
      },
      tdStyle2:{
        width: "30%"
      },
      tdStyle3:{
        width: "15%"
      },
      tdStyle4:{
        width: "10%"
      },
      tdStyle5:{
        width: "12%"
      },
      tdStyle6:{
        width: "12%"
      },
      tdStyle7:{
          width: "16%"
      }
    }
    return (
      <div>
        <Table
          height={450}
          fixedHeader={false}
          fixedFooter={false}
          selectable={true}
          multiSelectable={true}
          onRowSelection={(sels)=>this.onRowSelection(sels)}
        >
          <TableHeader
            displaySelectAll={true}
            adjustForCheckbox={true}
            enableSelectAll={true}

          >
            <TableRow>
              <TableHeaderColumn style={styles.tdStyle1} tooltip="level">level</TableHeaderColumn>
              <TableHeaderColumn style={styles.tdStyle2} tooltip="taskName">taskName</TableHeaderColumn>
              <TableHeaderColumn style={styles.tdStyle3} tooltip="owner">owner</TableHeaderColumn>
              <TableHeaderColumn style={styles.tdStyle4} tooltip="taskType">taskType</TableHeaderColumn>
              <TableHeaderColumn style={styles.tdStyle5} tooltip="taskGroup">taskGroup</TableHeaderColumn>
              <TableHeaderColumn style={styles.tdStyle6} tooltip="projectTeam">projectTeam</TableHeaderColumn>
              <TableHeaderColumn style={styles.tdStyle7} tooltip="status">status</TableHeaderColumn>
            </TableRow>
          </TableHeader>
          <TableBody
            displayRowCheckbox={true}
            deselectOnClickaway={false}
            showRowHover={true}
            stripedRows={true}
          >
          {rows}

          </TableBody>
        </Table>
      </div>
    );

导入{
桌子
表体，
表格标题，
TableHeaderColumn，
TableRow，
TableRowColumn，
}来自“物料界面/表格”；
getTable（）{
让行=[]；
对于（var i=0；i
水平
任务名
主人
任务类型
工作组
项目组
地位
{rows}
);

您可以尝试使用

tdStyle2:{
  width: "30%",
  wordBreak: "break-all"
},