Vue.js 2.x v-for 在 <table> 中不起作用(属性 或方法未定义)

Vue.js 2.x v-for in a <table> not working (Property or method not defined)

我试图遍历 Vue 实例的数据部分中定义的数组,因此可以自动确定 table 头。但是当我运行代码时,控制台输出如下:

代码如下(合并 .js 文件):

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Vue Demo</title>
        <link href="http://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.css" rel="stylesheet">  
        <script src="http://unpkg.com/vue/dist/vue.js"></script>
    </head>
    <body>
        <div class="container">
            <div class="row clearfix">
                <div class="col-md-12 column">
                    <h3>
                        Staffs
                    </h3>
                    <table id="mytable" class="table table-hover">
                        <thead>
                            <tr>
                                <th v-for:"term in items">
                                {{term}}
                                </th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td>6556</td>
                                <td>
                                    TB - Monthly
                                </td>
                                <td>
                                    01/04/2012
                                </td>
                                <td>
                                    Default
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>           
            </div>
            <div class="row clearfix">
                <div class="col-md-8 column">
                    <ul class="pagination">
                        <li>
                            <a href="#">Prev</a>
                        </li>
                        <li v-for="n in 5">
                            <a href="#">{{n}}</a>
                        </li>                           
                        <li>
                            <a href="#">Next</a>
                        </li>
                    </ul>
                </div>
                <div class="col-md-4 column">
                    <button class="btn btn-default" type="button">button</button>
                </div>
            </div>
        </div>
        <script>
      'use strict';
      console.log("here we go!");
      var tab = new Vue({
       el: '#mytable',
       data: {
        items: ['aa','bb']    
       }
      });
     </script>
    </body>
    </html>

外观运行ce 就像:

替换

v-for:"term in items"

v-for="term in items"