reactjs - How to color specific cells in Table -


i have html table in reactjs app , want color specific cells or rows there. have array in state , want check differences between neighbor rows , show differencies coloring them on red.

class maintable extends component {   constructor(props) {     super(props);     this.state = {       results: []     };   }   render() {     const sorted = _.sortby(this.state.results, ['origin', 'datastamp']);     return (       <div>         <div>           <table hover striped bordered responsive size="sm">             <thead>               <tr>                 <th>version</th>                 <th>date</th>                 <th>origin</th>               </tr>             </thead>             <tbody>               {sorted.map(result =>                 <tr>                   <td>{result.version}</td>                   <td>{result.datastamp}</td>                   <td>{result.origin}</td>                 </tr>               )}             </tbody>           </table>         </div>       </div>     );   } } 

i have no idea how that. maybe idea? sorry noobie question, i'm new reactjs.

you can use

<tr style={{'background-color': result.color}}>...</tr> 

or

<tr style={{'background-color': shouldhighlight[key] ? 'red' : 'white'}}>...</tr> 

obviously in second case need findout before function, table rows should highlighted , store in array.

also, need write map function in format (result, key) => ... or need know id of result.


Comments

Popular posts from this blog

python - Selenium remoteWebDriver (& SauceLabs) Firefox moseMoveTo action exception -

html - How to custom Bootstrap grid height? -

transpose - Maple isnt executing function but prints function term -