Vue.js 突然不工作了

Question

我正在使用 Vue.js，但由于某种原因它刚刚停止工作。我似乎找不到我的错误 - 看了好几个小时。

这是我的 HTML 文件 - 只是依赖项和一个在 users 中显示数据的表格。

<!DOCTYPE html>
<html>
    <head>
        <title>Hello, world!</title>
    </head>
    <body>
        <script
            src="https://code.jquery.com/jquery-3.3.1.min.js"
            type="text/javascript">
        </script>
        <link 
            href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"
            rel="stylesheet" 
        >
        <script
            src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"
            type="text/javascript">
        </script>
        <script
            src="https://cdn.jsdelivr.net/npm/vue"
            type="text/javascript">
        </script>

        <script src="/js/app.js" type="text/javascript"></script>

        <div class="container">
            <div id="app">
                <table class="table">
                    <thead>
                        <tr>
                            <th>Name</th>
                            <th>Personal Number</th>
                            <th>Volcano Amount</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr v-for="user in users">
                            <td><% user.name %></td>
                            <td><% user.personal_number %></td>
                            <td><% user.volcano_amount %></td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </body>
</html>

这是 app.js 文件 - 它只是初始化 Vue 实例，创建 users 数组，并运行更新 users 数组的 AJAX 请求。

var app = new Vue({
    el: '#app',
    data: {
        users: []
    },
    mounted: function() {
        var vue_object = this;
        $.getJSON('users', function(data) {
            vue_object.users = data;
        });
    },
    delimiters: ['<%', '%>']
});

结果非常令人失望 - 一切都是纯 HTML。该表有 2 行 - 标题，以及带有 <% user.xxx %> 的行，好像 Vue 不存在一样。

我猜这意味着某些东西没有运行，尽管 app.js 本身确实运行了（我尝试添加 console.log 并且它确实打印了）

希望你有好的想法:)

Answer 1

将您的 app.js 文件包含在 body 标记的底部。 当你在做：

var app = new Vue({
el: '#app',

带有#app标签的元素不存在