Can't I use the mixins function of parent component in child component?

Question

I am using the mixins function in the vuejs to code efficiently. And then, I had a question. I have imported mixins 'TTS' in the parent component. And then the child component called the function of the tts. However, the function was not called. Is the parent component mixtns function not available in the child component?

import { tts } from "../components/mixins/tts/tts";

export default {
  mixins: [tts]
}

This is importing mixins in the parent component.

    <ion-row
      class="drawer_middle_menu ion-align-items-center ion-justify-content-center"
      @click="trySpeak($t('timeOut'))"
    >{{$t('timeOut')}}</ion-row>

And this is a child component. The 'trySpeak' function is a function in TTS that was imported by the parent component.

Usually you have to use imports on the components where you want to use the mixins if you don't have a global import. — mahatmanich

Michael Michael · Accepted Answer · 2020-02-19T06:57:30

No, you would need to either pass as a prop or import directly into child component. With that said there are not recommended ways such as $parent but I would stay away from that. See here for more info: https://vuejs.org/v2/guide/components-edge-cases.html

Can't I use the mixins function of parent component in child component?

1 Answers