vantUI，Axiso，常见问题及使用：

一：vantUI

1：vant安装不成功！

    是npm的版本问题：

降低npm版本：npm install npm@6.13.4 –g
安装这个版本：npm install -S vant@2.12.2

2：vant中Toast不起作用：

    出现这问题就是你是全局引入vant那么只需要在当前页面下引入：

import { Toast } from 'vant';
//使用
Toast ('这是测试')

二：Axiso

1:在Axios中post请求数据过程中问题

拦截器配置可以看官网 这里根据axios的使用全流程（php后端）举个例子共7步

第一步：安装axios
第二步：安装Qs
第三步：在main.js中注入如下


 //安装Axios
 import http from 'axios'
 //Axios拦截器  
 import '../api/config'
 //Axios跨域地址
 http.defaults.baseURL = 'https://xxx.cn';//
 Vue.prototype.$http=http; //暴露出去


第四步拦截器（目录../api/config）：

  import http from 'axios'
  // 添加请求拦截器
 http.interceptors.request.use(function (config) {
    // 在发送请求之前做些什么
    return config;
  }, function (error) {
    // 对请求错误做些什么
    console.log('请求已拦截》》》》》错误：response');
    return Promise.reject("错误码："+error);
  });
  
  // 添加响应拦截器
  http.interceptors.response.use(function (response) {
    // 对响应数据做点什么
    return response;
  }, function (error) {
    // 对响应错误做点什么
    console.log('请求已拦截》》》》》错误：response');
    return Promise.reject("错误码："+error);
  });

第五步：这里根据开发习惯，一般我们在使用中都会封装的（在confing同目录下）
 export default {
  APItext:'/index',// index为后端接口最终url=https://xxx.cn/index.php
 }

第六步：使用在例如text.vue中我们要请求后端：

 import Qs from 'qs';//导入qs
 import api from '../../api/api.js'//导入api

   //在methods或者其其他vue生命周期中
   var configs = { headers:{'Content-Type':'application/x-www-form-urlencoded;charset=UTF-8'}};
          this.$http.post(api.APItext,Qs.stringify({'data':'测试数据'}),configs)
          .then((response)=>{
                console.log(response.data);
           })
          .catch(function (error) {
          console.log("错误");
          console.log(error);
          });


第七步：PHP后端接受
 $action=request()->post('data'); //此时后端$action=测试数据

2：Axios过程中的get请求和post一样但是也可以这么使用

我们对api进行拼接

第五步：这里根据开发习惯，一般我们在使用中都会封装的（在confing同目录下）
 export default {
  APItext:'/index?data=',// index为后端接口最终url=https://xxx.cn/index.php
 }

第六步的时候：
 //在methods或者其其他vue生命周期中
          this.$http.get(api.APItext+"测试数据2"))
          .then((response)=>{
                console.log(response.data);
           })
          .catch(function (error) {
          console.log("错误");
          console.log(error);
          });

第七步：PHP后端接受
 $action=request()->post('data'); //此时后端$action=测试数据2

三：VUEx的使用

this.$store.state.strdata.van_nav_title="传值"

//如创建stroe文件夹下，的index.js
import Vue from 'vue';
import Vuex from 'vuex';
import strdata from './strdata';
Vue.use(Vuex);

export default new Vuex.Store({
    modules: {
        strdata,
    },
    
});

//在stroe的index.js同目录下  创建strdata.js
export default {
    state: { 
        van_nav_title:'初始值',
    },mutations: {
        //更新数据
        updata_nav_title(state,van_nav_title){
            state.van_nav_title=van_nav_title
            // console.log(state.van_nav_title);
        }
    }
}
//在任何vue中动态修改van_nav_title

this.$store.state.strdata.van_nav_title="注册"
this.$store.commit('updata_nav_title','方法传入');

四： less和less-loader-问题>

都是版本问题：

关闭项目在运行 cnpm i --save less@3.11.1 less-loader@5.0.0 
或者npm i --save less@3.11.1 less-loader@5.0.0