组件模板引用

        某些 HTML 元素对于放在其中的元素类型有限制，例如 <ul>，<ol>，<table> 和 <select>，相应的，某些元素仅在放置于特定元素中时才会显示，例如 <li>，<tr> 和 <option>。

        这将导致在使用带有此类限制元素的组件时出现问题，自定义组件将作为无效的内容被忽略，因此推出优质解决方案： is="vue:组件名"

        这属于 元素位置限制

<div id='app'>
        <table>

            <!-- 如果这里直接书写 自定义组件, 那么会将 tr 放在 table 外边 -->
            <!-- <mytr></mytr> -->

            <!-- is="vue:组件名" -->
            <tr is="vue:mytr"></tr>

        </table>
    </div>
    <script>
        const app = Vue.createApp({
            data() {
                return {}
            }
        })

        app.component('mytr', {
            template: `<tr>
                <td>标题1</td>
                <td>文本1</td>
            </tr>`
        })
        app.mount('#app')
    </script>
</div>