vue項目基本流程


一、做項目基本流程:

    1、規划組件結構

        Nav.vue

        Header.vue

        Home.vue.....

    2、編寫對應路由

        vue-router

    3、具體些每個組件功能

    一些公共的文件jquery,jquery插件,一般在index.html文件里面引用

  分析項目需要的模塊:

      vuex vue-router axios

 

  assets:  放置 靜態文件 image,css,js

二、

    watch:{//用來監視路由發生變化時觸發

    $route(to,from){

      console.log(to.path)//to將要去的路由,from為原路由

      if(to.path=='/user-info'){

        this.$store.dispatch('show-header')//觸發actions

      }

    }

}

---------------------------------------------------

三、axios:可以配置

    axios不能Vue.use(axios)

    axios.interceptors.request.use();//發送請求配置

    axios.interceptors.response.use();//接收請求配置

    axios.interceptors.request.use(function (config) { //配置發送請求的信息
    stores.dispatch('showLoading')
    return config;
    }, function (error) {
    return Promise.reject(error);
    });

    axios.interceptors.response.use(function (response) { //配置請求回來的信息
    stores.dispatch('hideLoading')
    return response;
    }, function (error) {

    return Promise.reject(error);
    });

    將axios放在vue的原型上

    Vue.prototype.$http = axios  //其他頁面在使用axios的時候直接  this.$http就可以了

    axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';設置axios post頭部信息,使用表格格式傳輸

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM