CODEWITHSUNDEEP
reactjs
Kevin Bourdal
Kevin Bourdal

Reputation: 3

How to add icons to keys that come from the database in react

I want to add the icons that correspond to each parameter that comes from the database ... it is for a search filter ... here is the code

render() {
    let lugares = Object.keys(this.state.filters).map((key) => {
        // this.state.filters_selected
        return (
            <div className="mb-5 ml-2">
            <Row>
             {Object.values(this.state.icons).map((clave) => {
                        console.log(clave)      
               }
                )}
                <MDBIcon className='mt-1' icon={this.state.icons} />
              <h4 className="ml-1 ">{key}</h4>
                <hr className="accent-4 ml-1 mt-1  mr-5 grey lighten-5" style={{ width: "150px" }} />
                </Row>

icons is a dictionary that you create above icons:[{'Vehiculo':'car', 'Inmueble':'home','Muebles':'couch', 'Otros':'circle'}]

and in filters the same keys that I have icons arrive .. how could I do so that each icon is painted in its corresponding key?

Upvotes: 0

Views: 539

Answers (1)

lanxion
lanxion

Reputation: 1430

Assuming icons is the object containing the key-value pair for the specific icons, and each key in filters holds the key for each icon, then pretty simply you should be able to replace icon={this.state.icons} with icon={this.state.icons.key} or icon={this.state.icons[key]}. Hope this helps.

Upvotes: 0

Related Questions