zoukankan      html  css  js  c++  java
  • 网络请求

    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} ]
  • 相关阅读:
    多态问题----针对方法
    画了个Android——Canvas类的使用(转)
    设计模式之策略模式
    Listview多种布局的使用
    Activity的退出和進入效果
    java.lang.ClassNotFoundException
    台球小游戏
    线性表
    堆栈
    动态内存管理
  • 原文地址:https://www.cnblogs.com/wangruifang/p/7778469.html
Copyright © 2011-2022 走看看