0
respostas

É possível transformar uma variável em uma função?

Estou fazendo um projeto pessoal com react e estou usando os cursos para melhorar meu cód. Então fui apresentado ao .map() como uma solução para diminuir o html, usei o .map() para diminuir a repetição de botões, pois mudavam só alguns parametros, mas o problema é que um desses parametros era uma função do "onClick". Cód que usei:

export default class Card extends Component {
    render() {
        return (
            <div className="carta">
                {Array.of(
                    [
                        "carta_botao-passiva",
                        "acaoPassiva()",
                    ],
                    [
                        "carta_botao-habilidade-arma",
                        "acaoHabilArma()",
                    ],
                    [
                        "carta_botao-habilidade-um",
                        "acaoHabilUm()",
                    ],
                ).map((infos, index) => {
                    let idBotao = infos[0];
                    let acao = infos[1];

                    return (
                        <button
                            key={index}
                            type="button"
                            onClick={acao}
                            className="carta_botao-habilidade"
                            id={idBotao}
                        />
                    );
                })}
            </div>
        );
    }
}

Com esse cód o console diz que esperava uma função no "onclick" mas recebeu uma string. Já tentei usar o eval(), mas, além do react gritar pra eu não fazer, ele apaga tudo que tem na tela ou o erro passa a ser "objeto" em vez d "string". É isso, tem alguma forma de eu manter o cód pequeno e utilizar diferentes funções no "onClick"?