Simple list (that doesn't work) f7 and vue

Murals.vue

<template>
    <div>
        <!-- Scrollable page content-->
        <f7-block-title>{{ title }}</f7-block-title>
        <f7-block inner>

            <ol id="example-murals">
                <!-- this displays blank list items -->
                <li v-for="item in items">
                    {{item.title}}
                </li>
            </ol>

            <f7-block-title>Murals</f7-block-title>
            <f7-list>
                <!-- this won't even compile -->
            </f7-list>
        </f7-block>
    </div>
</template>

<script>
    import F7List from "framework7-vue/src/components/list";


    export default {
        name: 'Murals',
        components: {F7List},
        mounted() { // when the Vue app is booted up, this is run automatically.
            var self = this;
            let dataURL = 'https://jsonplaceholder.typicode.com/posts';
            this.$f7.request.get(dataURL, function (data) {
                self.items = data;
                console.log(data);
            });
        },
        data () {
            return {
                title: 'Murals',
                items: []
            };
        }
    };
</script>