一.使用is解决标签渲染中的小bug
1.如下代码，将表格中的<tr><td></td></tr>组件化
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<!-- 开发环境版本，包含了有帮助的命令行警告 -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
<div id="app" >
<table>
<tbody>
<row></row>
<row></row>
<row></row>
</tbody>
</table>
</div>
<script>
//定义全局组件
Vue.component('row',{
template:`
<tr>
<td>啦啦啦</td>
</tr>
`
}),
new Vue({
el:'#app'
})
</script>
</body>
</html>运行结果图示
乍一看是对的，但是细心的小伙伴会发现，组件row明明是引用在tbody中，但是在运行之后会发现:组件解析到外面去了 这是一个bug
2.解决方法：
上出现的原因是因为在html5中，tbody下必须为tr,如果是row就违背了html5的规范。那么我们就这样写：
<table>
<tbody>
<tr is="row"></tr>
<tr is="row"></tr>
<tr is="row"></tr>
</tbody>
</table>使用is
运行结果图示：
这时候会发现<tr><td></td></tr>成功解析到tbody中了
3.其他可能会产生此bug的标签
- select
- ul
- ol
- 等等
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用。你还可以使用@来通知其他用户。