Try to implement tree-view example with error

Hello, I try to implement tree-view from this https://vuejs.org/v2/examples/tree-view.html sample to my laravel 5.5/vue.js application. In resources/assets/js/app.js I added lines :

// define the item component
Vue.component('item', {
    template: '#item-template',
    props: {
        model: Object
    },
    data: function () {
        return {
            open: false
        }
    },
    computed: {
        isFolder: function () {
            return this.model.children &&
                this.model.children.length
        }
    },
    methods: {
        toggle: function () {
            if (this.isFolder) {
                this.open = !this.open
            }
        },
        changeType: function () {
            if (!this.isFolder) {
                Vue.set(this.model, 'children', [])
                this.addChild()
                this.open = true
            }
        },
        addChild: function () {
            this.model.children.push({
                name: 'new stuff'
            })
        }
    }
})


window.Vue.use(VueRouter);

In my listing file resources/assets/js/components/tasks/TasksIndex.vue I add item template declaration and calling the root element of the item:

<template>
   <section>
        ...

         <!-- the demo root element -->

<!-- item template -->
<script type="text/x-template" id="item-template">
  <li>

    <div
      :class="{bold: isFolder}"
      @click="toggle"
      @dblclick="changeType">
      {{model.name}}
      <span v-if="isFolder">[{{open ? '-' : '+'}}]</span>
    </div>

    <ul v-show="open" v-if="isFolder">

      <item
        class="item"
        v-for="model in model.children"
        :model="model">
      </item>

      <li class="add" @click="addChild">+</li>
    </ul>
  </li>
</script>

            treeData::{{ treeData }}
            <ul id="demo">
               <item class="item" :model="treeData">
               </item>
            </ul>
        ...

   </section>
</template>




<script>
    import appMixin from '../../appMixin';

    // demo data
    var dataArray = {
        name: 'My Tree',
        children: [
            { name: 'hello' },
            { name: 'wat' },
            {
                name: 'child folder',
                children: [
                    {
                        name: 'child folder',
                        children: [
                            { name: 'hello' },
                            { name: 'wat' }
                        ]
                    },
                    { name: 'hello' },
                    { name: 'wat' },
                    {
                        name: 'child folder',
                        children: [
                            { name: 'hello' },
                            { name: 'wat' }
                        ]
                    }
                ]
            }
        ]
    };

    export default {
        data: function () {
            return {
                header_title : 'Tasks',
                ...
                treeData:  dataArray
                ...
            }

        },

        mixins : [appMixin],

        created() {
        },

        mounted() {
            this.loadTasksList()
        }, // mounted() {

        methods: {

            
        }
    }
</script>


<style scoped lang="css">
.item {
   cursor: pointer;
}
.bold {
   font-weight: bold;
}
ul {
   padding-left: 1em;
   line-height: 1.5em;
   list-style-type: dot;
}
</style>

And In console of my browser I see error :

Vue warn]: Property or method "model" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property. See: https://vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties.
found in
---> <TasksIndex> at resources/assets/js/components/tasks/TasksIndex.vue
 "TypeError: Cannot read property 'name' of undefined"
found in
---> <TasksIndex> at resources/assets/js/components/tasks/TasksIndex.vue
       <Root>

1. What I did not understabd in which part of my pages have I to install

<script type="text/x-template" id="item-template">
...
</script>
code block?

1. Why have I error with model ? I suppose “model” that is property of “item” object and I send treeData to it. Is it because of question 1)?

Thanks!