42 lines
1.2 KiB
React
42 lines
1.2 KiB
React
|
import React, { Component } from 'react';
|
||
|
|
import './component-styling.css'
|
||
|
|
|
||
|
|
class Ticket extends Component {
|
||
|
|
state = {ticket :[
|
||
|
|
|
||
|
|
{price:'150fr',duration:'20min'},
|
||
|
|
{price:'200fr',duration:'30min'},
|
||
|
|
{price:'350fr',duration:'40min'},
|
||
|
|
{price:'450fr',duration:'50min'},
|
||
|
|
{price:'500fr',duration:'60min'},
|
||
|
|
{price:'180fr',duration:'35min'},
|
||
|
|
{price:'100fr',duration:'10min'}
|
||
|
|
|
||
|
|
]
|
||
|
|
};
|
||
|
|
render() {
|
||
|
|
return (
|
||
|
|
<div className='grid-item'>
|
||
|
|
<table className="table">
|
||
|
|
<thead>
|
||
|
|
<tr>
|
||
|
|
<th scope='col'>Price</th>
|
||
|
|
<th scope='col'>Duration</th>
|
||
|
|
</tr>
|
||
|
|
</thead>
|
||
|
|
<tbody className="tbody">
|
||
|
|
{this.state.ticket.map(tic=>
|
||
|
|
<tr>
|
||
|
|
<td scope='row'>{tic.price}</td>
|
||
|
|
<td scope='row'>{tic.duration}</td>
|
||
|
|
</tr>
|
||
|
|
)}
|
||
|
|
|
||
|
|
</tbody>
|
||
|
|
</table>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
export default Ticket;
|