【问题标题】:Uncaught ReferenceError: Vue is not defined while displaying table未捕获的 ReferenceError:显示表格时未定义 Vue
【发布时间】:2020-06-14 15:04:27
【问题描述】:

我是 vue.js 的新手。我有一个用 bootstrap-vue 生成的表,我想在单个列中进行过滤。我跟着这个答案“Bootstrap-vue b-table with filter in header”。但是我在控制台中得到“未捕获的 ReferenceError:Vue 未定义”,并且得到“模板根不允许 'v-for' 指令”。我无法解决它。

请帮帮我。

<div id="app">
<b-table striped show-empty :items="filtered">
  <template slot="top-row" slot-scope="{ fields }">
    <td v-for="field in fields" :key="field.key">
      <input v-model="filters[field.key]" :placeholder="field.label">
    </td>
  </template>
</b-table>
</div>
<script>

  new Vue({
  el: '#app',
  data: {
    filters: {
      id: '',
      issuedBy: '',
      issuedTo: ''
    },
    items: [{id:1234,issuedBy:'Operator',issuedTo:'abcd-efgh'},{id:5678,issuedBy:'User',issuedTo:'ijkl-mnop'}]
  },
  computed: {
    filtered () {
      const filtered = this.items.filter(item => {
        return Object.keys(this.filters).every(key =>
            String(item[key]).includes(this.filters[key]))
      })
      return filtered.length > 0 ? filtered : [{
        id: '',
        issuedBy: '',
        issuedTo: ''
      }]
    }
  }
})

</script>

【问题讨论】:

    标签: vue.js


    【解决方案1】:

    最好知道 Vue 库是如何导入的,但是对于引用错误,请确保在您显示的文件之前和包含 vue-boostrap 之前插入 Vue 库脚本标记。

    【讨论】:

    • 它不工作。我正在学习vue js。我试图通过从头开始安装项目来实现这一点。我做了几页,但是当我在浏览器上运行 vue 页面时,它显示空白页。所以我从 github(Link=bezkoder.com/jwt-vue-vuex-authentication) 下载了这个项目,我在那个下载的项目上尝试了这个代码,但它不起作用。请帮我。 @Nicolas Brondin-Bernard
    【解决方案2】:

    缺少Vue声明你必须在/div之后添加这个脚本

    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    

    【讨论】:

      猜你喜欢
      • 2023-01-23
      • 2018-05-17
      • 2020-02-02
      • 2020-06-21
      • 1970-01-01
      • 2017-12-13
      • 1970-01-01
      • 2019-01-06
      • 2017-08-23
      相关资源
      最近更新 更多