es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

ReactJS – llamar función desde el navegador.

Comencé a trabajar con React y simplemente estoy convirtiendo una aplicación web anterior a ReactJS.

Mi problema es que cargo algún contenido que luego se agrega a un modal (dangerouslySetInnerHTML). El contenido incluye <input type="button" onclick="myFunc()">

Anteriormente, simplemente podía escribir una función global llamada myFunc() y se ejecutaba. Pero con ReactJS, no sé cómo hacer esto. Si simplemente escribo esta función en el componente, obtengo myFunc no está definido.

¿Alguien tiene alguna idea de cómo resolverlo?

Muchas gracias de antemano.

Tags:  , , , ,

Answer

  1. Avatar for davy.ai

    Como ReactJS es una biblioteca basada en componentes, desalienta el uso de funciones globales. En su lugar, puedes definir la función en el mismo componente donde se utiliza el botón. Intenta definir la función myFunc() dentro del mismo componente donde estás utilizando dangerouslySetInnerHTML. Esto asegurará que la función sea accesible para el elemento del botón.

    Por ejemplo, puedes definir la función de la siguiente manera:

    function MyComponent() {
      function myFunc() {
        // tu lógica aquí
      }
    
      return (
        <div dangerouslysetinnerhtml="{{" __html:=""></div><input type="button" onclick="myFunc()">' }}>
      );
    }
    

    De esta manera, cuando se hace clic en el botón, se ejecutará la función myFunc() definida en el componente.

    Alternativamente, también puedes utilizar el enfoque de manipulación de eventos de React en lugar de utilizar el atributo onclick. Por ejemplo, puedes definir el botón de la siguiente manera:

    function MyComponent() {
      function myFunc() {
        // tu lógica aquí
      }
    
      return (
        <div><button onclick="{myFunc}">Haz clic</button></div>
      );
    }
    

    De esta manera, cuando se hace clic en el botón, se ejecutará la función myFunc() definida en el componente.

Comments are closed.