
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title></title>
<script src="lib/vue.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<div id="box">
<button type="button" @click="isCreated=!isCreated">click</button>
<template v-if="isCreated">
<div>11111</div>
<div>22222</div>
<div>33333</div>
</template>
<!-- template是一个包装元素,不会创建在页面上 -->
</div>
<script type="text/javascript">
new Vue({
el:"#box",
data:{
isCreated:true
}
})
</script>
</body>
</html>
template是一个包装元素,作为一个容器,不会渲染到页面上,也就不会破坏原dom结构。
© 版权声明
文章版权归作者所有,未经允许请勿转载。
THE END
喜欢就支持一下吧
请登录后发表评论
注册