Vue：大合集（连载中）

更新时间：2021 年 4 月 13 日

控制台报错变量找不到，但数据能显示

描述：异步请求导致的bug
解决：使用v-if延迟渲染

<h2 v-if="itemDetail.basicInfo">{{itemDetail.basicInfo.name}}</h2>

vant 的自定义字体图标

<i class="iconfont icon-home"></i>
<van-icon class="iconfont" class-prefix="icon" name="home" />

配置文件夹路径

// 写在vue.config.js中
chainWebpack: (config) => {
  config.resolve.alias
    .set("@", path.join(__dirname, "src"))
    .set("@assets", path.join(__dirname, "src/assets"))
    .set("@components", path.join(__dirname, "src/components"));
};

vue 跨域反向代理

// 写在vue.config.js中
devServer: {
    port: 8848,
    open: true,
    // 跨域代理
    proxy: {
      // /xm123 主路径的配置
      '/xm123': {
        target: 'https://api.it120.cc', // 后台接口域名
        changeOrigin: true, // 是否跨域
        pathRewrite: {
          '^/xm123': '/xm123'
        }
      }
    }
  }

解决 eslint 变量未定义，程序无法执行的问题

• 在 vue.config.js 中加上 lintOnSave: false

//写在vue.config.js中
module.exports ={
  lintOnSave: false;
}