JSFiddle - React, Tailwind, and code Playground

by rigor789

HTML

<ListView :items="items">
   <v-template>
     <StackLayout>
        <Label :text="item.title" />
     </StackLayout>
   </v-template>
   
   <v-template name="featured" if="item.featured">
      <StackLayout>
        <Label :text="FEATURED" />
        <Label :text="item.title" />
      </StackLayout>
   </v-template>
</ListView>

JavaScript

/*
	This is a pseudo-code example of the ideal markup
  for a ListView in NativeScript-Vue.
  
  What needs to happen for this to work:
  	- v-template must be able to return a function
      which would render the contents with a given scope
    - if should be converted to a template selector function
      and eval'd for each item
    - ListView should be able to list the keyed templates
    
  What needs to be figured out:
  	- how to convert the v-template contents to a function
      similar to scoped slots
*/