Vue.JS且戰且飛(十五)

2017 iT 邦幫忙鐵人賽

DAY 15

Modern Web

Vue.JS且戰且飛系列第 15 篇

2017鐵人賽 vue.js eagle 老鷹且戰且飛

老鷹(eagle)

2016-12-16 22:00:05

2567 瀏覽

分享至

使用XMLHttpRequest取得GitHub資料

jsfiddle

<html>
<head>
    <meta charset="UTF-8">
    <title>使用XMLHttpRequest取得GitHub資料</title>
</head>
<body>
<div id="show">
    {{ url_data }}
</div>
</body>
<script src="vue.js"></script>
<script>
    var demo = new Vue({

        el: '#show',

        data: {
            url_data: []
        },
        created: function () {
            this.getData();
        },
        methods: {
            getData: function () {
                var apiURL = 'https://api.github.com/repos/vuejs/vue/commits';
                var xhr = new XMLHttpRequest();
                var self = this;
                xhr.open('GET', apiURL);
                console.log(xhr.open('GET', apiURL));
                xhr.onload = function () {
                    self.url_data = xhr.responseText;
                }
                xhr.send()
            }
        }
    })

</script>
</html>