¿Cómo puedo pasar mi manejador de eventos como $$restProps a un componente hijo?
Tengo un componente de entrada de datos como este:
<script lang="ts"></script>
<div class="wrap-input">
<input
class='input'
type="text"
{...$$restProps}
/>
</div>
<style lang="scss">
// algunos estilos
</style>
He utilizado el componente de entrada de datos en el padre:
<script lang="ts">
// función del controlador de eventos
const onKeyUp = (evento) => {
console.log(evento)
}
</script>
<main>
<Input
on:keyup={onKeyUp} // ¿Cómo puedo enviar este evento al componente de entrada de datos como $$ restProps?
className="input-todo"
placeholder="¿Qué necesita ser hecho?"
/>
</main>
<style lang="scss">
// algunos estilos
</style>
davy.ai
Para pasar el evento
onKeyUp
al componenteinput
como$$restProps
, puede modificar el código del componenteinput
para que acepte$$restProps
como un argumento y luego expanda el argumento en el elementoinput
.Aquí le mostramos cómo hacerlo:
Luego, puede modificar el script
parent
para usar el componenteInput
y pasar el eventoonKeyUp
usando$$restProps
:De esta manera, la función manejadora del evento
onKeyUp
se pasará al componenteinput
como$$restProps
y se vinculará al eventokeyup
.