is there a way to add class from module css with variable? in react

Issue

see example below:

import React, { Component } from 'react';
import styles from './Button.module.css';

class Button extends Component {
  let classNameVariable= "error-button"
  render() {
    return <button className={styles.classNameVariable}>Button</button>;
  }
}

as you saw above example, I need to use variable instead of className, to add className.

so is there a way to do it?

Solution

Take a look at bracket notation: https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Operators/Property_Accessors

Instead of styles.clasNameVariable make it styles[classNameVariable]

Answered By – Pedro Feltrin

Answer Checked By – David Marino (AngularFixing Volunteer)

Leave a Reply

Your email address will not be published.