[Vuejs]-Vue slot-props are not being passed through to child component

by

0👍

✅

I think problem is in the @click="action.onClick" thing. You’re not showing us your function, and you trying to bind it through the object (it’s absolutely unnecessary).

Here are the code that working:

Parent

<Child>
  <template v-slot:action>
    <v-btn :disabled="!action.valid" @click="onClick()" color="primary">{{action.text}}</v-btn>
  </template>
</Child>

components: {
  Child,
},

data: () => ({
  action: {
    text: "Connect",
    valid: false
  }
})

methods: {
  onClick() {
    console.log('Clicked!')
  }
}

Child

<slot name="action"></slot>

Example on codesandbox: https://codesandbox.io/s/codesandbox-vue-vuetify-3jije

Leave a comment