vue 编码但不渲染的标签 vue-fragment

vue 下载包: npm i -s vue-fragment

在main.js 里添加代码

import Fragment from 'vue-fragment'
Vue.use(Fragment.Plugin)

在文件里就可以直接用<fragment> 元素了

<template>
	  <fragment>
			<div>test</div>
	</fragment>
</template>

最终渲染结果 就只有 div 一种元素了

<div>test</div>

用 fragment 这个技术的原因,主要是为了把fragment 当成根节点 然后循环 template 标签
因为 vue 默认的template 不能在根节点循环 但我又不想再去渲染多余的标签
这个问题我是在循环 element NavMenu 导航菜单 时发现的

<template>
  <!-- fragment 在此做根节点 页面不渲染此标签-->
  <fragment>
    <!-- template 循环-->
    <template v-for="(item,index) in list">
    
    </template>
  </fragment>
</template>

还有另一种用法 我没有用到就不记录了 详细地址访问
https://developer.aliyun.com/mirror/npm/package/vue-fragment