![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue3.0+vite
傻小胖
一个正在爬的小胖子
展开
-
vue3使用createVNode时警告 Non-function value encountered for default slot. Prefer function slots for be
问题 :main.ts:88 [Vue warn]: Non-function value encountered for default slot. Prefer function slots for better performance.原创 2024-04-22 15:03:49 · 952 阅读 · 0 评论 -
vue3.0 带响应式的 provide与inject用法
provide与inject主要用于从父组件向子组件传递数据。在2.0我们通常用props接收来自父组件的参数,但是一个要从父子组件传递到孙子组件,这种情况就得从父组件到子组件,再从子组件传到孙子组件一级一级传递下去;引入 provide与inject就不需要一级一级向下传递。而是只需从父组件provide出去,再在需要用的组件里面inject即可。如图论组件层次结构有多深,父组件都可以作为其所有子组件的依赖提供者。这个特性有两个部分:父组件有一个 provide 选项来提供数据,子组件有一个原创 2022-05-13 14:37:05 · 3540 阅读 · 1 评论 -
element el-cascader el-select @change expand-change自定义参数传递和接收
方法一:参数传递<el-cascader v-model="value" :options="List" @expand-change="handleChange($event,'222')" /><el-cascader v-model="value" :options="List" @change="handleChange($event,'222')" />参数接收 handleChange(value, path) => {原创 2022-05-05 10:55:22 · 3391 阅读 · 0 评论 -
vue中<router-view> can no longer be used directly inside <transition> or <keep-alive>
问题:如描述所说[Vue Router warn]: <router-view> can no longer be used directly inside <transition> or <keep-alive>. Use slot props instead就是vue-router不再使用原来的写法,用slot插槽代替原因:检查vue-router的版本一般是4.x以上的都改用了新的写法解决:改成:<router-view v-sl原创 2022-03-16 18:02:55 · 11505 阅读 · 1 评论 -
vue3.0+ts 找不到模块“./XXX.vue”或其相应的类型声明。
报错原因是:typescript 只能理解 .ts 文件,无法理解 .vue文件因此需要给.vue文件加上类型说明文件解决方法:在项目根目录或 src 文件夹下创建一个后缀为 .d.ts 的文件,并写入以下内容:declare module '*.vue' { import type { DefineComponent } from 'vue' // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typ...原创 2022-03-16 17:03:39 · 9888 阅读 · 3 评论 -
vue3+ts+axios请求封装
1.首先安装axiosnpm install axios -S 2.request.ts统一封装的请求接口(本人是在utils里面新建request.ts)import axios from 'axios'import { ElMessage } from 'element-plus'// import store from '@/store'// import { getToken } from '@/utils/auth'export const reques..原创 2022-03-14 14:56:47 · 11734 阅读 · 5 评论 -
vue3.X+vite+elementPlus+ts+vuex项目搭建之五——vue3.x 中路由vue-router配置方法以及vue-router路由的跳转方法以及参数的传递和接收
一、安装npm install vue-router@4二、配置vue-router1.src文件下新建文件夹router与store平级,并配置路由index.tsimport Vue from 'vue'import { createRouter, createWebHashHistory, RouteRecordRaw } from 'vue-router' // Vue.use(Router) export const constRouter:Arra原创 2022-03-14 11:05:14 · 1922 阅读 · 0 评论 -
vue3.X+vite+elementPlus+ts+vuex项目搭建之四——引入vuex以及store类型定义
目录一、安装vuex二、使用多模块store配置根目录创建store文件夹1.先在module下创建app.ts2.创建index.ts3.挂载在vue实例上4.在逻辑页面ts文件中使用一、安装vuexnpm install vuex@next -Snpm install vuex-composition-helpers@next -S二、使用多模块store配置根目录创建store文件夹1.先在module下创建app.tsimport..原创 2022-03-10 15:57:30 · 3729 阅读 · 0 评论 -
vue3.0+vite+elementPlus+ts项目搭建之三——使用proxy配置代理转发以及配置使用@路径引入
一、proxy配置代理转发+变更启动端口主要是为了解决跨域vite.config.ts文件中import { defineConfig } from 'vite'import vue from '@vitejs/plugin-vue'import AutoImport from 'unplugin-auto-import/vite'import Components from 'unplugin-vue-components/vite'import { ElementPlusReso原创 2022-03-09 14:53:53 · 3232 阅读 · 1 评论 -
vue3.0+vite+elementPlus+ts项目搭建之二——引入UI组件elementPlus
一、安装elemenPlusnpm install element-plus --save二、引入elementPlus跟elementUI一样有全局引入和按需引入两种方式1.全局引入在main.ts中引入import { createApp } from 'vue'import App from './App.vue'++import ElementPlus from 'element-plus'const app = createApp(App)++app.us..原创 2022-03-09 09:29:25 · 1904 阅读 · 0 评论 -
vue3.0+vite+elementPlus+ts项目搭建之一——vite脚手架搭建基础demo
目录一、安装vite二、创建基础demo三、启动基础demo一、安装vite使用npmnpm create vite@latest使用yarnyarn create viteVite 需要Node.js版本 >= 12.0.0。然而,有些模板需要依赖更高的 Node 版本才能正常运行,当你的包管理器发出警告时,请注意升级你的 Node 版本。二、创建基础demonpmnpm create vite@latest my-vue-app -..原创 2022-03-08 11:43:03 · 1385 阅读 · 0 评论 -
vite 配置使其他人能够访问本机项目,解决“vite use `--host` to expose”
是因为IP没有做配置,所以不能从IP启动,所以通过IP无法访问。需要在vite.config.js做相应配置:在vite.config.js中添加server.host为0.0.0.0export default defineConfig({ plugins: [vue()], server: { //使用IP能访问 host: '0.0.0.0' }})保存后就可以通过网络暴露使用IP访问项目...原创 2022-03-08 10:08:17 · 4181 阅读 · 0 评论