Question

我有一个简单的vue实例，该实例从数据数组生成表。文档在Firefox和Chrome上可以正常显示，但是在IE11中出现错误：

[Vue警告]：呈现根实例时出错。

我认为Vue与“现代浏览器”兼容，但是当开始在vue文档中查找兼容性信息时，我什么都没找到。

无论如何，您对如何解决此问题有任何想法吗？

        // initializing
        var notesView = new Vue({
            el: '#demo',
            data: {
                notes: []
            },
            methods: {
            }
        });

notesView.notes = JSON.parse('[{"noteTime":"2018-07-30T22:00:00.000Z","locationName":"Q3000010","noteText":"NoteText0"},{"noteTime":"2018-07-31T22:00:00.000Z","locationName":"Q3000020","noteText":"NoteText1"}]');

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.16/vue.js"></script>
<div id="demo">
  <div v-if="notes.length > 0">
    <table class="table table-bordered">
      <tbody>
        <template v-for="(note,index) in notes">
          <tr class="condensed" :class="index % 2 === 0 ? 'odd' : ''">
            <td width="150px">
              {{ note.noteTime }}
            </td>
            <td>
              {{ note.locationName }}
            </td>
          </tr>
          <tr :class="index % 2 === 0 ? 'odd' : ''">
            <td colspan="2">
              {{ note.noteText }}
            </td>
          </tr>
        </template>
      </tbody>
    </table>
  </div>
  <div v-else="">
    <div class="alert alert-warning" role="alert">
      There are no notes here yet...
    </div>
  </div>
</div>

Answer 1

这对我有用。我正在使用x-template脚本绕过IE11的限制-损害了代码的可读性，并且需要特别注意IE ...

/js/foo.js

// initializing grid control
        var notesView = new Vue({
            el: '#notes',
            template: '#v-notes-view',
            data: {
                notes: []
            },
            methods: {
            }
        });

notesView.notes = JSON.parse('[{"noteTime":"2018-07-30T22:00:00.000Z","locationName":"Q3000010","noteText":"NoteText0"},{"noteTime":"2018-07-31T22:00:00.000Z","locationName":"Q3000020","noteText":"NoteText1"}]');

v-for在IE11上产生错误

1 个答案: