vue.js中ajax请求

<div id="app">
    <table style="border-collapse: collapse">
        <thead>
            <tr  style="line-height: 30px;">
                <th style="width:20px; padding: 0 10px; border: 1px solid #ccc;">id</th>
                <th style="width:150px; padding: 0 10px; border: 1px solid #ccc;">item_name</th>
                <th style="width:500px; padding: 0 10px; border: 1px solid #ccc;">content</th>
                <th style="width:80px; padding: 0 10px; border: 1px solid #ccc;">way</th>
                <th style="width:150px; padding: 0 10px; border: 1px solid #ccc;">method</th>
            </tr>
        </thead>
        <tbody>
            <tr v-for="items in message" style="line-height: 30px;">
                <td style="width:20px; padding: 0 10px; border: 1px solid #ccc;">{{ items.id }}</td>
                <td style="width:150px; padding: 0 10px; border: 1px solid #ccc;">{{ items.item_name }}</td>
                <td style="width:500px; padding: 0 10px; border: 1px solid #ccc;">{{ items.content }}</td>
                <td style="width:80px; padding: 0 10px; border: 1px solid #ccc;">{{ items.way }}</td>
                <td style="width:150px; padding: 0 10px; border: 1px solid #ccc;">{{ items.method }}</td>
            </tr>
        </tbody>
    </table>
</div>

<script>
  var app = new Vue({
        el:"#app10",
        data:{
            message:''
        },
        methods:{
            created:function(){
                var sss = this;
                $.ajax({
                    url:"请求地址",
                    success:function(e){
                        sss.message = e.data;
                        console.log(sss.message)
                    }
                })
            }
        }
    });
    app.created();
</script>

  

posted @ 2017-01-20 15:09  blog-ze  阅读(260)  评论(0编辑  收藏  举报