鍍金池/ 問答/HTML/ vue中的一處不解

vue中的一處不解

文檔中說“如果我們從以下來源使用模板的話，這條限制是不存在的”，為什么？
圖片描述

回答
編輯回答
巫婆

意思是 有些默認(rèn)的標(biāo)簽只能嵌套指定的標(biāo)簽元素 否則不會(huì)生效
比如文檔說的 table ul ol option 這些標(biāo)簽 option只能用于select內(nèi) 這樣 不然沒有效果

2017年4月8日 06:48
編輯回答
貓小柒

我沒有遇到過這個(gè)限制，我的理解是，如果把模板寫在html里，會(huì)有這個(gè)限制，比如：

<html>
    <head>
        <link rel="stylesheet" href="index.css">
        <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    </head>
    <body>
        
        <div id="app">
            {{ message }}
        </div>
        
        <script>
            var app = new Vue({ 
                el: '#app',
                data: {
                    message: 'Hello Vue!'
                }
            });        
        </script>
    </body>
</html>

除此以外，比如在vue組件的模板里，或字符串形式的組件模板里，都沒有這個(gè)限制，因?yàn)檫@些情況下模板沒有直接被瀏覽器處理, 你可以用chrome打開下面這個(gè)html試一下，你就會(huì)發(fā)現(xiàn)其中的ttt標(biāo)簽被提到table外面了。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <span>hello, this is a test</span>
    <table>
      <ttt>haha</ttt>
    </table>
</body>
</html>

clipboard.png

2017年1月6日 21:02