javascript - 想要显示内联表的动态表头

Question

我正在实现动态标题，用户可以在其中输入它拥有表标题文本

所以我有一个长度为 3 的数组，每个索引都用“输入文本”初始化，这意味着我有一个这样的数组：
colarray[0]="enter text"
colarray[1]="enter text"
colarray[2]="enter text"
现在我想在表头中显示这些索引，显示内联，但是在我的情况下，它以垂直方式显示我让它们水平？我的代码下面是：

<table id="mytable"   className="table table-striped table-nowrap dataTable" cellSpacing="0" width="100%">
  <thead>
    <tr>
      {this.state.colarray.map((coldata,ind)=>{
        return(<div>
                 <th>{coldata}</th>
               </div>)
      })}
    </tr>
   </thead>
 </table>

但它垂直显示如下：

enter text
enter text
enter text

而我想水平显示表头。

标签： javascriptreactjshtml-table