CODEWITHSUNDEEP
vue.jsvuejs2
NerV
NerV

Reputation: 51

How add parent for each slots in vuejs?

I'm trying add parent span for each slot on my component, but it isn't working.

render(createElement) {
  return createElement('div', this.$slots.default.map(vnode => createElement('span', vnode)));
},

I want get html like below

<div>
  <span><img /></span>
  <span><img /></span>
  <span><img /></span>
</div>

but max what i can get it is

<div>
  <span>
    <img />
    <img />
    <img />
  </span>
</div>

how fix it?

Upvotes: 1

Views: 408

Answers (1)

Bert
Bert

Reputation: 82439

Try this.

render(h){
  return h("div", this.$slots.default.map(v => {
    // eliminate returns, comments
    if (!v.tag)
      return v

    return h('span', [v])
  }))

Example.

Upvotes: 1

Related Questions