I have created a table that appears when its done loading:
{this.state.tableLoading ? this.Tableloading() : this.TableSection()}
the table function:
TableSection = () => {
return (
<div>
// I want to acces FilterTrue and Filterfalse here
<div id="filtersection" style={this.state.filters ? this.render.FilterTrue : this.render.Filterfalse}>
</div>
<table id="ProductTable">
<thead>
<tr>
<th>Nr.</th>
<th>Title</th>
<th>Price</th>
<th>description</th>
<th>Quantity</th>
<th>file</th>
<th>Edit</th>
</tr>
</thead>
<tbody>
{this.state.allproducts.map(allproducts =>
<tr key={allproducts.id}>
<td>{this.state.ProductCount++} </td>
<td>{allproducts.title}</td>
<td>{allproducts.price}</td>
<td>{allproducts.description}</td>
<td>{allproducts.quantity}</td>
<td>{allproducts.filePath}</td>
<td width="250"> <div id="buttonsection">
<button id="deletebutton" onClick={() => this.deleteProduct(allproducts.id)}>Delete</button>
<button id="editbutton" onClick={() => this.deleteProduct(allproducts.id)}>Edit</button>
<button id="viewbutton" onClick={() => this.showView(allproducts.id)}>Show</button>
</div>
</td>
</tr>
)}
</tbody>
</table>
</div>
)
}
render variables that i want to acces:
render() {
const FilterTrue = {
opacity: "1",
height: "auto"
}
const Filterfalse = {
opacity: "0",
height: "0px"
}
return (
{this.state.tableLoading ? this.Tableloading() : this.TableSection()}
)}
how can i acces “Filterfalse” and “FilterTrue” in the “TableSection”