vue 入門教程1

vue3.5.5

1.npm install -g @vue/cli 全局安裝vue3.5

 

2.vue create admin  創建admin項目,不可以大寫

 

3.cd admin

 

4.npm install 

 

5.npm run serve 啓動項目

 

6.安裝 vue-router

npm install vue-router

 

7.建立router.js 文件

 

8.main.js 引入router.js

 

9.router 登錄,鉤子函數

 

10。vue_cookie

 

npm install vue-cookie --save

 

11.登錄router鉤子函數

https://segmentfault.com/a/1190000008383094 

 

12.element引入

vue add element,需要輸入一些東西

13.安裝後,會覆蓋原來的App.vue內容,選用重新輸入。

 

14.重定向

routes: [

    {

        path:'/',

        redirect:{name:"Login"}

        },  // 重定向到主頁

 

}

15.登錄

https://blog.csdn.net/sps900608/article/details/79502171

 

 

 

16.axios

npm install --save axios vue-axios

https://www.npmjs.com/package/vue-axios

 

17.axios跨域

根目錄下,新建vue.config.js

module.exports = {

    devServer: {

        // 設置代理

        proxy: {

            "/api": {

                target: "http://www.haitunhaigou.cn", // 訪問數據的計算機域名

                ws: true, // 是否啓用websockets

                changOrigin: true, //開啓代理

                logLevel: 'debug',

                pathRewrite: {

                    '^/api': 'http://www.haitunhaigou.cn'

                }

            }

        }

    }

};

 

調用格式

axios.get('/api/blog', {

  params: {

    ID: 12345

  }

})

    .then(function (response) {

      console.log(response);

    })

    .catch(function (error) {

      console.log(error);

    });

 

18.axios同步

https://segmentfault.com/q/1010000015962729?utm_source=tag-newest

methods: {

    async login () {

 

        var res =  await  this.$http.get('/api/blog', {

            params: {

                ID: 12345

            }

        });

        console.log('--',res);

 

19.vuex

https://www.cnblogs.com/moqiutao/p/10026723.html  首次1小時差不多

1.npm install vuex --save

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

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