我想折叠ReactJS表行中的一些列。请找到正在尝试的代码。

render() {
    return (
            <tr>
            <button className="btn btn-primary" type="button" 
            data-toggle="collapse" 
            data-target="#collapseExample" 
            aria-expanded="false" 
            aria-controls="collapseExample">
            +
            </button>
            <td>{ this.state.item.line_number }</td>
            <td>{ this.state.item.product_code }</td>
            </tr>

            <tr className="collapse" id="collapseExample">
            <div className="well">
            <td>{ this.state.item.net_price }</td>
            <td>{ this.state.item.discount }</td>
            </div>
           </tr>
          )
        }

我想打开面板（折叠面板）一旦我点击了“+”按钮。但我得到了错误的第二个标签。我不能呈现两个标签在render（）方法。
我如何才能实现这个解决方案？