vue-例5-3Vue依赖浏览器的HTML解析和标准化处理.html

最新推荐文章于 2024-05-30 08:59:56 发布

虾米大王

最新推荐文章于 2024-05-30 08:59:56 发布

阅读量356

点赞数

分类专栏： Vue 文章标签：前端 javascript html

本文链接：https://blog.csdn.net/modern358/article/details/129968593

版权

Vue 专栏收录该内容

661 篇文章 4 订阅

订阅专栏

Vue在处理DOM模板时依赖浏览器的HTML解析和标准化过程，这导致了一些限制，比如特定元素如

组件，以及正确的做法，应使用。同时，文章介绍了如何创建并使用自定义组件来遵循HTML规范。摘要由CSDN通过智能技术生成

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Vue依赖浏览器的HTML解析和标准化处理</title>
</head>
<body>
    <div id="app">
        <h2>Vue依赖浏览器的HTML解析和标准化处理</h2>
        <p>当使用DOM作为模板时，例如，将el选项挂载到一个已存在的元素上，</p>
        <p>你会受到HTML的一些限制，因为Vue只有在浏览器解析和标准化HTML后才能获取模板内容。</p>
        <p>尤其像元素ul、ol、table、select限制了被它包裹的元素，</p>
        <p>而一些像option这样的元素只能出现在其他某些元素内容</p>
        <h3>错误的做法</h3>
        <table border="1">
            <tr><th>表格标题</th></tr>
            <my-row></my-row>
        </table>
        <h3>正确的做法</h3>
        <table border="1">
            <tr><th>表格标题</th></tr>
            <tr is="my-row"></tr>
        </table>
    </div>

    <script src="../js/vue.js"></script>

    <script>
        Vue.component('my-row',{
            template:'<tr>这个是自定义组件</tr>'
        });

        let vm = new Vue({
            el:'#app'
        });
    </script>
</body>
</html>