Can't Access Props in NativeScript Vue Modal

I'm using a modal to show a listView and I want to pass the list into the modal as an array. I call the modal, like so:

this.$showModal(Picker, { props: { list: [

  { name: "Item 1" },
  { name: "Item 2" },
  { name: "Item 3" }

]}});

The modal loads fine, and I can see the props in the modal when I console.log

created: function(){
  console.log(this.list);
}, 

However, I can't access the props in the template or loop over them.

 <ListView for="item in listOfItems">
   <v-template>
     <Label :text="item.name" class="listItem" />
   </v-template>
 </ListView>

I have also tried:

<ListView :for="item in $props.list">

My full code for the modal component is below:

<template>
  <Page>

     <ListView for="item in listOfItems">
       <v-template>
        <Label :text="item.name" class="listItem" />
       </v-template>
     </ListView>

  </Page>
</template>

<script>

  export default {

    props: ["list"],

    created: function(){
      console.log(this.list);
    },

    data(){
      return {
        listOfItems: this.list
      }
    }
  }

</script>

What am I doing wrong?