CODEWITHSUNDEEP
vue.jsvuejs2vue-componentvuexvue-router
J. Doe
J. Doe

Reputation: 21

How to set data from slot-scope to component

I'm new in Vuejs, I have some problems with slot-scope,

<template>
  <some-component>
    <div slot-scope="{someMethod, someData}">
      // the problem is i need someMethod in my current component, not in template
    </div>
  </some-component>
</template>


<script>
export default {
 created() {
   // i need to access someMethod and someData here
   this.someMethod();
 }
}
</script>

Is it possible? What is the best practice way?

Upvotes: 2

Views: 478

Answers (1)

Steven Spungin
Steven Spungin

Reputation: 29071

You can send your component's method to your slot host, and then provide that in the returned slot scope.

<host :someMethod='someMethod'>
  <div slot='foo' slot-scope='{someMethod}'>{{someMethod()}}</div>
  </div>
</host>

Or send the entire component to the slot host, and have the host send it back.

<host :me='me'>
  <div slot='foo' slot-scope='{me}'>{{me.someMethod()}}</div>
  </div>
</host>

<script>
computed:{
  me(){ return this;
  }
}
</script>

Upvotes: 1

Related Questions