How to apply mouseover function to component in Svelte-CodePudding

I have the following elements:

Parent.svelte

<script>
    import Child from './Child.svelte';

    function handleMouse(){

    }

</script>

<Child on:mousedown={handleMouseDown} on:mouseover={handleMouse}/>

<div draggable="true" on:mousedown={handleMouseDown} on:mouseover={handleMouse}>Text</div>

Child.svelte

<div draggable="true">Child text</div>

How can I get the handleMouse() function to work on the child component, when the function is in the parent component?

I can recreate the function inside of the child component, but is there a way to just bind to the parent functions for the child element?

CodePudding user response：

You can forward events from a child component by specifying on: with only the event name, e.g.

<div draggable="true" on:mousedown on:mouseover >Child text</div>