码迷,mamicode.com
首页 > Web开发 > 详细

vue.js中ajax请求

时间:2017-01-20 16:17:49      阅读:363      评论:0      收藏:0      [点我收藏+]

标签:pre   items   item   table   var   function   this   padding   order   

<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>

  

vue.js中ajax请求

标签:pre   items   item   table   var   function   this   padding   order   

原文地址:http://www.cnblogs.com/lrzbiog/p/6322925.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!