• 网络请求


    fake api:
    http://jsonplaceholder.typicode.com/posts
    方便对于网络模块做测试。

    正常情况,需要公司的服务器。

    一、网络请求
    需要vue-resource.js插件

    this.$http
    .get('url')
    .then(function(response){
    // response.data 就是服务器端所返回的数据
    })

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <script src="js/vue.js"></script>
        <script src="js/vue-resource.js"></script>
        
    </head>
    <body>
    <div id="container">
        <p>{{msg}}</p>
        <ul>
            <li v-for="tmp in myList">{{tmp}}</li>
        </ul>
    </div>
    <script>
        new Vue({
            el: "#container",
            data: {
                msg: "Hello Vue",
                myList:[]
            },
            mounted:function(){
                //发起网络请求
                this.$http.get("data/test.json").then(function(response){
                    console.log(response);
                    this.myList = response.data;
                })
            }
        })
    </script>
    </body>
    </html>
    data/test.json文件
    [ {"name":"Tom","age":20}, {"name":"Tom","age":20}, {"name":"Tom","age":20} ]
  • 相关阅读:
    原码, 反码, 补码 详解
    位移运算符
    ASP.NET中httpmodules与httphandlers全解析
    MySQL count
    真正的能理解CSS中的line-height,height与line-height
    IfcEvent
    IfcWorkCalendarTypeEnum
    IfcSingleProjectInstance
    转换模型
    IfcTypeProduct
  • 原文地址:https://www.cnblogs.com/wangruifang/p/7778469.html
Copyright © 2020-2023  润新知