首页 > 解决方案 > Colspan 不使用 react js

问题描述

我是网络开发的新手。我有一张桌子,就像->

  <Table striped condensed hover id="jobData">
                            <thead style={backgrounColour}>
                                <tr>
                                    <th>Sr.No.</th>
                                    <th>Company Name</th>
                                    <th>Technology</th>
                                    <th>Job Title</th>
                                    <th>Total Score</th>
                                    <th>Average Score</th>
                                </tr>
                            </thead>
                            <tbody>{this.props.jobData.map(function (item, key) {
                                return (
                                    <tr key={key}>
                                        <td><b style={compName}>{item.id}</b></td>
                                        <td><b style={compName}>{item.attributes.companyName}</b></td>
                                        <td>cdcdcdcdc</td>
                                        <td>{item.attributes.name}</td>
                                        <td><b style={compName}>30</b></td>
                                        <td><b style={compName}>30</b></td>
                                    </tr>
                                )
                            })}</tbody>
                        </Table>

现在,这里有 headers 。现在,在这之后我还有一张桌子,你可以在页脚说

  <div className="row">
                    <Table condensed hover id="score">
                        <tbody>
                            <tr>
                                <td colSpan={3}>
                                    YesterDay's Score
                                </td>
                                <td >
                                    240
                                    </td>
                                <td >
                                    30
                                    </td>
                            </tr>
                        </tbody>
                    </Table>
                </div>

现在在这里,我想要的是第二个表数据应该在最后三个标题数据所在的相同列中。所以在做的时候,我尝试colspan = {3}了第二张桌子,这样它就会跳过前三张。但它不工作。

sr.No  Company Name   Technology  Job Title  Total Score   Average Score
  1      abc            cdhcd         cdhh       12            89

  ---> multiple rows like this -->                                    
                               YesterDay's Score  60           89   

所以这就是我想要的。第二个表没有任何标题。那么,我能为此做些什么呢?

我试过 colspan 谢谢。

标签: javascriptcsshtmlreactjs

解决方案


推荐阅读