Vue.js <template> 在 <tr> 内，使用 IE 11

Question

我有一个模板，在每个 tr 中，我需要显示两个 td。这是通过这样的层次结构完成的：

tbody
  tr v-for
    template v-for
      td
      td

是的，循环中有循环。 Chrome 对此没有问题，但 IE 拒绝显示它。我在这里有什么选择吗？

Answer 1

Jeff 已经在他的评论中解释了这个问题（IE 不支持 <template>）。

一种处理此问题的 hacky 方法是使用组件和 is="" 属性:

<tr v-for="thing in things">
  <td v-for="subThing in thing" is="hackyComponent" :item="subThing">

在 hackyComponent 中：

<td>{{item.a}}</td>
<td>{{item.b}}</td>

export default {
 replace: true //replaces the original <td> with the template content
               // Vue might complain about creating a "Fragment Instance" in development, but that's not a real problem.

}

Vue.js <template> 在 <tr> 内，使用 IE 11

Vue.js <template> inside <tr> with IE 11

javascript

internet-explorer-11

vue.js