Aplicación.js
export default function App() { const handleClick=(data1,data2)=>{ console.log(data1,data2). ----> output: Hello world This is a sentence } return ( <div className="App"> <TestBox onClick={handleClick} /> </div> ); }TestBox.js
export function TestBox(props) { return ( <div onClick={() => props.onClick("Hello world", "This is a sentence")} style={{ height: "100px", width: "100px", border: "1px solid black" }} > <h1>Hello</h1> </div> ); }Codesandbox del ejemplo anterior
Pregunta principal
Suponiendo que no leí el código fuente en TestBox.js, ¿cómo saber que TestBox.js proporcionó 2 parámetros (datos1 y datos2) para mis funciones?
Más contexto
Frecuentemente tengo este problema cuando uso bibliotecas de terceros, como ejemplo, la documentación de Rechart.JS especifica que puedo llamar a la función onMouseEnter , pero no especifica que tengo acceso al parámetro de data . Por lo tanto, ni siquiera sé que tengo acceso a 'datos' hasta que intenté imprimirlo como se muestra a continuación. Por lo tanto, tengo la pregunta anterior.
<LineChart width={730} height={250} data={data} onMouseEnter={(data)=>console.log(data)} > //omitted </LineChart>Lo que me gusta hacer es probar una función con tantos parámetros como sea posible y consolarlos después:
unknownFunction(a,b,c,d,e) => console.log(a,b,c,d,e);También trato de buscar en la documentación y tratar de encontrar más allí.
También puede intentar importar la función y esperar que IDE le muestre más información (es decir, comentarios, propTypes, anotaciones de @types, etc.).
Finalmente, siempre puede buscar en el código fuente la firma de la función.