JSFiddle - React, Tailwind, and code Playground

by Simon Herteby

HTML

<div id="vue">
  <h2>Fails:</h2>
  <div>
    <test v-for="n in list" :key="n">
      <template slot-scope="x">
        <div>Test1</div>
        <div>Test2</div>
      </template>
    </test>
  </div>
  <h2>Works:</h2>
  <div>
    <test v-for="n in list" :key="n">
      <template slot-scope="x">
        <div>Test1</div>
        <div>Test2</div>
      </template>
    </test>
    <b>Extra sibling to the rescue!</b>
  </div>
</div>

Vue

Vue.component('test', {
	functional:true,
  render(h, context){
  	return context.data.scopedSlots.default()
  }
})

new Vue({
	el:'#vue',
  data(){
  	return {
    	list:[1,2,3]
    }
  },
  mounted(){
  	console.log(this.$options.render.call(this))
  }
})
console.log(Vue.version)