创建HTML为什么template的内容没显示,而且有#doucment-fragment

img


 <head>
        <meta charset="utf-8">
        <title>vue的使用</title>
        <script src="./vue.js" type="text/javascript" charset="utf-8"></script>
    </head>
    <body>
        <div id="app">
            <p>{{title}}</p>
            <my-component></my-component>
        </div>
        <template id="tmpl">
            <p>{{title}}</p>
        </template>
        <script type="text/javascript">
            Vue.component('my-component', {
                template: '#tmpl',
                data() {
                    return {
                        title: '我是组件内的title'
                    }
                }
            })
            var vm = new Vue({
                el: '#app',
                data: {
                    title: '我是实例'
                }
            })
        </script>

    </body>
</html>

<script src="https://cdn.jsdelivr.net/npm/vue@2.6.14"></script>

img