vue的異步

vue沒有封裝異步的方法,可以使用第三方插件:axios

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

<script src="https://cdn.staticfile.org/axios/0.18.0/axios.min.js"></script>

<div id="app">
        <h1>網站列表</h1>
        <div v-for="site in info">
            {{ site.amttitle }}
        </div>
    </div>
    <script>
        new Vue({
            el: '#app',
            data: { info: null },
            mounted() {
                var self = this;
                axios
                    .get('http://***/api/Announcement', {
                        headers: { "Authorization": "***" },
                        params: { amttitle: "角色" },//是即將與請求一起發送的 URL 參數
                        // `responseType` 表示服務器響應的數據類型,可以是 "arraybuffer", "blob", "document", "json", "text", "stream"
                        responseType: "json", // 默認的

                        data: {// 只適用於這些請求方法 "PUT", "POST", 和 "PATCH"
                            firstName: "Fred"
                        }
                    })
                    .then(function (response) {
                        if (response.data.code == 0) {
                            self.info = response.data.data.list;
                        }
                    })
                    .catch(function (error) { // 請求失敗處理
                        console.log(error);
                    });
            }
        })
    </script>

詳細的參數配置可以參考:https://www.runoob.com/vue2/vuejs-ajax-axios.html

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章