jquery的ajax和vue的v-for 无法绑定动态数据？

<!DOCTYPE html>
<html lang="en">
<head>

    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>


<div id="app_m">
    <button v-on:click="getData">电影</button>
    <tr v-for="item in items">
        <td>{{item.title}}</td>
        <!--<td>{{item.year}}</td>-->
        <!--<td>{{item.subtype}}</td>-->
    </tr>
</div>


<script src="vue.js"></script>
<script src="jquery-3.2.0.js"></script>
<script>



    var web_douban = new Vue({
        el : '#app_m',
        data :{
            datas:''

            },

        methods :{
            getData : function () {
                $.ajax({
                    type : 'Get',
                    dataType : 'jsonp',
                    url : ' http://api.douban.com/v2/movie/top250',
                    success : function (data) {
                        web_douban.data=data.subjects;
                        console.log(web_douban.data)


                    }
                })


            }
        }
    })


</script>
</body>
</html>

这里显示的报错信息

这是那个对象

ajax vue.js javascript

阅读 4.6k

3 个回答

得票最新

悠扬小Q

2.3k1412

发布于
2017-03-29

✓ 已被采纳

最重要的一个错误：把<tr>,<td>换掉，td是配合table用的，你单独的让vue去使用它会报错的.你可以先将它改成div,span
第一个错误：
你的<tr v-for="item in items"> items 没有在data中去定义，所以vue告诉你这个是错误的，看你的写法应该是想迭代datas吧？
第二个错误：
ajax success 函数中赋值不对，你的v-for是迭代的items，为什么要给datas赋值？所以你在v-for中应该把items换成datas