qs 的使用 vue 的favicon.ico的配置

最新推荐文章于 2023-08-29 11:20:02 发布

原创最新推荐文章于 2023-08-29 11:20:02 发布 · 380 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#qs #axios #favicon.ico #vue

vue 专栏收录该内容

15 篇文章

订阅专栏

本文详细介绍如何利用qs库解决axios默认以JSON格式发送数据的问题，包括安装、全局引入、具体应用实例，以及如何在Vue项目中配置和使用favicon.ico。

1.说明

qs解决了axios向后台发送数据的默认格式为json。

2.安装

npm install qs --save-dev

3.全局引入 main.js

import Qs from 'qs'
Vue.prototype.Qs = Qs

4.引用

this.$axios.post(
             "接口地址",
              this.Qs.stringify({
                name: `${this.ruleForm.name}`,
                phone: `${this.ruleForm.phone}`,
                code: `${this.ruleForm.code}`
              })
            )
            .then(res => {
              console.log(res);
              if (res.data.status == 1 && res.data.msg == "报名成功!") {
                this.payment();
              } else if (res.data.status == 0) {
                this.message = res.data.msg;
                this.showMessage = true;
                setTimeout(() => {
                  this.showMessage = false;
                }, 3000);
              }
            });
        } else {
          return false;
        }

5. favicon.ico的引入

<link rel="shortcut icon" href="./favicon.ico" type="image/x-icon" /> 
//需要将图片放在index.html的根目录下

6.favicon.ico的配置

1.在build文件夹下，找到webpack.dev.conf.js，配置如下
 new HtmlWebpackPlugin({
      filename: 'index.html',
      template: 'index.html',
      inject: true,
      favicon: path.resolve("favicon.ico")    //需要添加的内容
    }),
    
  2.重启项目 npm run dev ，部分浏览器需要强制刷新 Ctrl+F5