关于Vue3中使用vant轻提示的问题

514 阅读1分钟

因为我使用的是vite,所以一开始我就使用了以下的方式注册

image.png

后来发现,我想使用Toast 轻提示的使用,怎么导入也不行

然后改了一下,用回这种方式导入组件

image.png

然后就可以了

image.png

具体如下

//main.js
import { createApp } from 'vue'
import App from './App.vue'
import { createPinia } from 'pinia'
import router from './router/index'
let pinia = createPinia()
import 'amfe-flexible'
import './style/base.less'
import Vant from 'vant'// 这里
import 'vant/lib/index.css'// 这里
createApp(App)
  .use(pinia)
  .use(router)
  .use(Vant)// 这里
  .mount('#app')
//拦截器中使用
import { Toast } from 'vant'// 按需导入
// 响应拦截器
request.interceptors.response.use(
  res => {
    return res.data
  },
  err => {
    if (err.status !== '200') {
      Toast.fail(err.response.data.message)// 失败提示
    }
    return Promise.reject(err)
  }
)