Vue模版语法

195 阅读1分钟

Vue模版语法 分离

方法一

使用 script 标签 类型为 x-template

    <div id="app"></div>

    <script type="x-template" id="my-app">
        // 编写模版语法
    </script>
    
    <script>
        Vue.createApp({
            // 在 createApp对象中 字符串如果是 # 开头,那么它就会被视作为 document.querySelector("#my-app");
            template: '#my-app'
        }).mount("#app");
    </script>

方法二

使用 template 标签

    <div id="app"></div>
    
    <template id="my-app">
        // 编写模版语法
    </template>
    
    <script>
        Vue.createApp({
            template: "#my-app",
        }).mount("#app");
    </script>