VUE3

element-plus vue3 dialog form 清空 重置 resetFields

参考:https://blog.csdn.net/zhengjf123/article/details/127293374 参考:https://blog.csdn.net/Start2019/article/details/100091495 ......
element-plus resetFields element dialog plus

Vue3从入门到精通(三)

vue3插槽Slots 在 Vue3 中,插槽(Slots)的使用方式与 Vue2 中基本相同,但有一些细微的差异。以下是在 Vue3 中使用插槽的示例: // ChildComponent.vue <template> <div> <h2>Child Component</h2> <slot></ ......
Vue3 Vue

[vue3-print-nb]vue3中实现打印功能

### vue3 安装 ``` npm install vue3-print-nb --save ``` ### 项目中引入 ``` // 全局引用 import { createApp } from 'vue' import App from './App.vue' import Print fr ......
vue3 vue3-print-nb vue 功能 print

Vue3+Element-Plus安装及模拟增删改查

软件安装:nodejs16 https://nodejs.org/download/release/v16.20.0/ 将npm设置为淘宝镜像: npm config set registry https://registry.npm.taobao.org 创建vue3项目: npm init vu ......
Element-Plus Element Vue3 Plus Vue

vue3+ts 分页hooks封装

import { reactive } from "vue"; export interface IPageInfo { pageNum: number; pageSize: number; totalCount: number; } export interface IUsePageReturn ......
hooks vue3 vue ts

vue3 el-dialog 的底部按钮居中

需要在el-dialog 外前台一层div 代码如下 ``` 这里写具体业务逻辑 取消 保存草稿 保存并提交 ``` css 代码如下 ``` ``` ......
底部 el-dialog 按钮 dialog vue3

教你如何用Vue3搭配Spring Framework

摘要:在本文中,我们将介绍如何使用Vue3和Spring Framework进行开发,并创建一个简单的TodoList应用程序。 本文分享自华为云社区《Vue3搭配Spring Framework开发【Vue3应用程序实战】》,作者:黎燃。 一、介绍 Vue3和Spring Framework都是现 ......
Framework Spring Vue3 Vue

vue3+vite+js配置路径别名

1、让vscode认识@符号 项目下新建jsconfig.json,配置 baseUrl,paths 参数 { "compilerOptions": { "target": "esnext", "useDefineForClassFields": true, "module": "esnext", ......
别名 路径 vue3 vite vue

vue3

# https://cn.vuejs.org/guide/introduction.html#what-is-vue # 简介 ``` import { createApp } from 'vue' createApp({ data() { return { count: 0 } } }).moun ......
vue3 vue

vue3 vscode快捷模板

{ "Print to console": { "prefix": "v3", "body": [ "<script setup>", "import { ref, reactive, onBeforeMount, onMounted, onBeforeUpdate, onUpdated, onBe ......
模板 vscode vue3 vue

vue3 defineExpose()

使用 script setup 的组件是默认关闭的——即通过模板引用或者 $parent 链获取到的组件的公开实例,不会暴露任何在 script setup 中声明的绑定。 可以通过 defineExpose 编译器宏来显式指定在 script setup组件中要暴露出去的属性: ``` ``` 当 ......
defineExpose vue3 vue

vue3自定义hook

### 什么是hooks - hook是钩子的意思,看到“钩子”是不是就想到了钩子函数?事实上,hooks 还真是函数的一种写法。 - vue3 借鉴 react hooks 开发出了 Composition API ,所以也就意味着 Composition API 也能进行自定义封装 hooks。 ......
vue3 hook vue

vue3标准开发过程

1.如何用脚手架快速新建一个vue3项目 安装vue-cli后,用如下命令创建 vue create my-vue3-project 默认创建vue3项目,直接回车即可。 新建完成后,如何引入element-plus? 用Webstrom打开项目, 先运行一次npm install 然后运行npm ......
过程 标准 vue3 vue

vue3+ts+vite antd自定义主题和vite打包配置资源压缩和分类打包, 第十一回

直接贴出vite.config.ts 的配置 plugins:[ vue(), AutoImport({ imports: ['vue', 'vue-router'], // 自动导入vue和vue-router resolvers:[ AntDesignVueResolver(), // 自动导入 ......
vite 主题 资源 vue3 antd

vue3+ts+vite enum keyof typeof a-table columns 里的使用 第十回

export enum Roles{ SuperAdmin='超级管理员', Admin='管理员', Other='其它', ... } 首先看一个基本的枚举类的定义,是的,做过后端的道友一看就知,在我们实际开发里,枚举一直是比较常用的类型,但是如何在TS里拿到枚举的值,就需要额外的学习一下了。 ......
a-table columns typeof keyof table

Vue3 新特性

## 一、Vue3.0 六大亮点 - Performance:性能比 Vue2.x 快 1.2~2 倍 - Tree shaking support:按需编译,体积比 Vue2.x 更小 - Composition API:组合 API - Better TypeScript support:更好的 ......
特性 Vue3 Vue

Vue3.2 新特性

## 1. 新的 SFC 特性 - ` Color is: {{ color }} ``` script setup 的几个优势 - 更少的样板内容,更简洁的代码。 - 能够使用纯 Typescript 声明 props 和发出事件。 - 更好的运行时性能 (其模板会被编译成与其同一作用域的渲染函数 ......
特性 Vue3 Vue

Vue3 添加公共方法方式

在 vue3 中是不会直接暴露 vue 对象给你使用了。所以不能像 vue2 那样直接在原型上挂载,想要添加公共方法可以有下面三种方式。 ### **第一种:使用 app.config.globalProperties 添加** ```js import { createApp } from "vu ......
方式 方法 Vue3 Vue

vue3透传 Attributes

“透传 attribute”指的是传递给一个组件,却没有被该组件声明为 props 或 emits 的 attribute 或者 v-on 事件监听器。最常见的例子就是 class、style 和 id 当一个组件以单个元素为根作渲染时,透传的 attribute 会自动被添加到根元素上 A组件: ......
Attributes vue3 vue

使用vscode + vite + vue3+ element3 搭建vue3脚手架

技术栈 开发工具:VSCode代码管理:Git前端框架:Vue3构建工具:Vite路由:vue-router状态管理:vuexAJAX:axiosUI库:element-ui 3数据模拟:mockjscss预处理:sass 构建viite + vue3 + element-ui3项目 1、安装vit ......
脚手架 vue3 vue element3 element

vue3引入bootstrap5的折叠菜单无效问题解决

问题:通过npm后者yarn安装bootstrap5后,在入口文件全局引入bootstrap5的js、scc,在vue组件引入折叠功能,点击可以正常展开,在点击无法收回 解决办法:可参考网上博主的建议,大概意思就是之前引入的js文件不对,导致收回方法没有执行 ![image](https://img ......
bootstrap5 bootstrap 菜单 问题 vue3

【Vue3】Vue3中常用的组件传参方式

# props/$emit 父传子 (自定义属性 props) ```html // 父组件代码 // 子组件代码 {{ name }} props: { name: { type: String, default: "default", }, } ``` 子传父(自定义this.$emit) `` ......
Vue3 组件 Vue 常用 方式

uniapp-chatgpt跨端仿ChatGPT实例|uniapp+vue3+pinia多端聊天模板

基于uniapp+vite4+pinia跨多端实现chatgpt会话模板Uniapp-ChatGPT。 uni-chatgpt 使用uni-app+vite4+vue3+pinia+uview-plus等技术构建多端仿制ChatGPT手机端APP会话应用模板。支持编译到h5+小程序+APP端,支持渲 ......
uniapp uniapp-chatgpt 实例 模板 chatgpt

【Vue】Vue3+Vite 实现 SVG 组件自动加载 icons 目录下所有文件

## 1. 安装依赖插件 vite-plugin-svg-icons > vite-plugin-svg-icons 用于生成 svg 雪碧图。 > 特点: 1.预加载 在项目运行时就生成所有图标,只需操作一次 dom 2.高性能 内置缓存,仅当文件被修改时才会重新生成 [vite-plugin-s ......
组件 Vue 文件 目录 icons

vue3.0之axios使用

```js // 导入包 import axios from "axios"; // 使用示例 axios.post('发送请求地址', { 携带变量key1: 变量value1, 携带变量key2: 变量value2, }).then(response => { // 后端返回给前端的数据都在re ......
axios vue3 vue

vue3.0之emit的使用

主要用于跨组件传输数据,emit可以调用父组件中的自定义函数。 # 使用方法 ```js let emit = defineEmits(['父组件自定义函数1', '父组件自定义函数2', '...']) // 调用父组件自定义函数的执行 emit('父组件自定义函数') ``` # 主要逻辑 1. ......
vue3 emit vue

vue3.0之cookies的操作

# 安装 ```js npm install vue-cookies ``` ```js import VueCookies from 'vue-cookies' const cookies = VueCookies cookies.set('key值', '字符串或变量', '7d') // 7d ......
cookies vue3 vue

VUE3学习笔记

VUE3出现已经很长时间了,由于工作比较忙,项目比较紧,现在才看,已经晚于很多人了。 这是vue3学习笔记,边学边写。 1,项目创建 可以使用git下载:winpty vue.cmd create hello-world 使用之后会让你选择vue2还是3 可以直接node创建:vue create ......
笔记 VUE3 VUE

VUE3中实现“收起”“展开”功能

《好记性不如烂笔头系列》 <template> <van-row> <div class="roadshowDescValueDiv"> <div ref="desContent" class="desContent" :class="{ 'show-all': desShowAll }"> <sp ......
功能 VUE3 VUE

vue3 手写组合API

# 3. 手写组合API ## 1) shallowReactive 与 reactive ```js const reactiveHandler = { get (target, key) { if (key '_is_reactive') return true return Reflect.g ......
vue3 vue API