Question

我遵循vue文档。我已经设置了下一个代码

        <div class="row" style="margin-top:15px;">
        <div class="col-md-12">
            <div id="app">
                <ol>
                    <li v-for="todo in todos">
                        {{ todo.text }}
                    </li>
                </ol>
            </div>
        </div>
    </div>
    <script type="text/javascript" src="{{ constant('JS_URL') }}lib/vue.js"></script>
    <script>
        new Vue({
            el: '#app',
            data: {
                todos: [
                    { text: 'Learn JavaScript' },
                    { text: 'Learn Vue' },
                    { text: 'Build something awesome' }
                ]
            }
        });
    </script>

我的输出如下：

    <div id="app">
<ol>
<li></li>
<li></li>
<li></li>
</ol>
</div>

我不明白这一点。它循环3次但没有显示数据。其文档中的所有其他示例都具有相同的结果。我不知道为什么会这样。

我在页面上还包含其他库，就像jquery一样但是我的控制台没有显示任何错误..它只显示我们在开发模式下运行的vue消息。

他们页面的第一个显示消息的例子也不起作用......我做错了什么？（即时通讯使用最新版本）

Answer 1

我正在使用TWIG模板引擎for php，它也使用{{}}符号，所以我更改了这样的vue分隔符：

            var app2 = new Vue({
            delimiters: ['${', '}'],

vue入门 - 没有数据显示

1 个答案: