VUE3 原生JS上传图片（支持多张上传）并实现预览删除功能
<template> <!-- 上传后显示 --> <div id="look"> <div id="look_img" v-for="(item, index) in imgSrc" :key="index"> <img :...
Vue3 自定义指令
自定义指令：常用于封装一些 DOM 操作，提高代码的复用性 语法格式： // 完整写法const 指令名 = { mounted: (el, binding) => {}, updated: (el, binding) => {}}// 简写const 指令名 = (el, bind...
vue3个人网站电子宠物
<template> <div class="pet-container" ref="petContainer"> <p class="pet-msg">{{ pet.msg }}</p> <img ref="petRef" @cl...
Vue3速成
文章目录 day 11. 创建vue3工程3. 响应式数据4. 计算属性day 25. watch 监视6. watchEffect7. 标签的`ref`属性8. 回顾TS中的接口_泛型_自定义类型 day 1 1. 创建vue3工程 相关代码如下： ## 创建vue工程npm creat...
【vue3学习笔记】customRef；provide与inject；响应式数据的判断-课程 P161节 《customRef》笔记
通过实现一个小例子来学习customRef：在输入框中输入内容时，底下的h3标签延迟一秒同步显示输入框中输入的内容。 customRef使用方法：调用customRef方法时，需要传入一个函数，此函数接收两个方法为参数：track和trigger。同时此函数需要返回一个对象，该对象中需要定义两个函...
vue3 element-plus 配置json快速生成form表单组件，提升生产力近600%（已在公司使用，持续优化中）
⚠️本文为博客园社区首发文章，未获授权禁止转载大家好，我是aehyok
vue3组件间的通信，通过props，emit，provide和inject把数据传递N个层级，expose和ref实现父组件调用子组件方法
文章目录 一、父组件数据传递N个层级的子组件vue3 provide 与 injectA组件名称 app.vueB组件名称 provideB.vueC组件名称 provideCSetup.vue二、使用v-model指令实现父子组件的双向绑定父组件名称 app.vue子组件名称 v-mode...
Vue3学习（六）之使用Vue3进行数据绑定及显示列表数据
一、写在前面说来还是比较惭愧的，从周二开始事就比较多，周三还电脑坏了，然后修电脑等等一些杂事，忙的团团转，因为周二、周三自己走的过多了，导致不敢直腰，周四卧床一天。...
vue3响应式原理
回顾vue2的Object.defineProperty 缺点 深度监听对象需要一次性递归无法监听新增属性、删除属性(Vue.set、Vue.delete)无法监听原生数组，需要特殊处理 学习proxy语法 Vue3中如何使用proxy实现响应式 Proxy 基本使用 // const d...
vue3 toRefs之后的变量修改方法
上效果 修改值需要带上解构之前的对象名obj， changeName:()=>{ // toRefs 解决后变量修改值方法： 解构前变量.字段=新值 obj.name = 'FEIFEI'; } } 案例源码 &...
vue3中安装并使用CSS预处理器Sass的方法介绍
文章目录 Sass是什么？为什么使用Sass?安装sass1、安装sass2、编写全局css变量/全局mixin3、vite引入并使用4、按需引入并使用sass语法1、变量创建一个变量使用变量变量作用域2、数学计算两个Sass有关于数学计算的“陷阱”3、嵌套4、Importssass中文官网...
记录--源码视角，Vue3为什么推荐使用ref而不是reactive
我的想法，ref就是比reactive好用，官方也是这么说的，不服来踩！下面我们从源码的角度详细讨论这两个 API，以及 Vue3 为什么推荐使用ref而不是reactive？ ref 的内部工作原理 ref 是一个函数，它接受一个内部值并返回一个响应式且可变的引用对象。这个引...
初识VUE3
1.VUE3官网 https://cn.vuejs.org/ 2.通过Vite创建项目 全局安装vite npm config set registry=https://registry.npmmirror.com 使用国内源npm install -g vite@latest 安装vite前要...
vue3 #ref #reactive
一、ref 函数将简单类型的数据包装为响应式数据 import { ref } from 'vue' const count = ref(10) 一、reactive函数将复杂类型的数据包装为响应式数据 import { reactive} from 'vue' const obj= reac
vue3的宏到底是什么东西？
前言从vue3开始vue引入了宏，比如defineProps、defineEmits等。我们每天写vue代码时都会使用到这些宏，但是你有没有思考过vue中的宏到底是什么？为什么这些宏不需要手动从vue中import？为什么只能在setup顶层中使用这些宏？vue 文件如何渲染到浏览器上要回答上面的问...
Vue3快速入门-资料
邓睿编程【2024最新版】3小时学会Vue3，小白零基础视频教程，web前端快速入门实战课程Vue3快速入门2 -案例篇Vue.js - 渐进式 JavaScript 框架
《Asp.Net Core3 + Vue3入坑教程》 - 配置CORS策略解决跨域问题
简介《Asp.Net Core3 + Vue3入坑教程》 此教程适合新手入门或者前后端分离尝试者。可以根据图文一步一步进操作编码也可以选择直接查看源码。每一篇文章都...
Vue3组件（九）Vue + element-Plus + json = 动态渲染的表单控件
Vue3组件（九）Vue + element-Plus + json = 动态渲染的表单控件 2021-02-22 14:34 金色海洋（jyk） 阅读(0) 评论(0) 编辑 收藏 一个成熟的表单表单表单，你已经长大了，你要学会：...
vue3系列：vue3.0自定义全局弹层V3Layer|vue3.x pc桌面端弹窗组件
基于Vue3.0开发PC桌面端自定义对话框组件V3Layer。前两天有分享一个vue3.0移动端弹出层组件，今天分享的是最新开发的vue3.0版pc端弹窗组...
npm create vue3项目特别慢
CSS3之过渡与动画 CSDN-Ada助手: 恭喜博主撰写第9篇博客！标题《CSS3之过渡与动画》非常吸引人，让我对这个主题更加好奇。阅读了您的博文后，我对CSS3的过渡和动画有了更深入的了...