current position:Home>Vue3 how do parent components call child component methods

Vue3 how do parent components call child component methods

2022-04-29 16:38:03segmentfault

vue3 How the parent component calls the child component method ? vue2, direct $refs. Just fine , Just write 3 I don't understand , How can I call



Other answers 1:

In parent component image.png Feed component ref
Then initialize image.png

In the child component image.png introduce useContext
And initialize const ctx = useContext();
Then export image.png
$ It is the object of all data of my sub component

Finally, the parent component calls comp.value.queryVo.xxxxx(params);


Other answers 2:

Child components

<script>
export default {
    setup() {

        const toPlay = () => {
            // TODO
        }
        return {

            toPlay
        }
    },
}
</script>

Parent component :

<template>
    <m-player ref="player"></m-player>
</template>
<script>
import { ref, unref } from 'vue'
import mPlayer from '@components/mPlayer.vue'

export default {
    components: {
        mPlayer,
    },
    setup() {

        const player = ref(null)
        
        const play = () => {
            //  Call the subcomponent method 
            unref(player).toPlay()
        }


        return {
            player,
        }
    },
}
</script>

copyright notice
author[segmentfault],Please bring the original link to reprint, thank you.
https://en.qdmana.com/2022/115/202204251040513846.html

Random recommended