VUE3.0 第6页

vue3.0 能拖动分割线查看两张图的前后对比效果(鼠标滑动两张图片前后对比)。

能拖动分割线查看两张图的前后对比效果(鼠标滑动两张图片前后对比)来吧展示comeonbaby：详细点开全屏看效果哦：duiBihtml:修复前修复后ts(typescript):import{onMounted,ref}from"vue"importBeforeAfterfrom'@/utils/beforafter'onMounted(()=>{newBeforeAfter({id:"#one"

造梦者FZ·2023-11-17 00:13

vue3.0 03 父子组件通信父组件使用ref获取子组件中所有数据子组件中使用expose限定父组件中获取范围操作流程

1.父组件使用ref获取到子组件所有数据流程1.创建Demo01子组件模板,在父组件中调用Demo01并且定义ref2.声明ref中数据内容letgetSonMsg=ref();3.从子页面获取到子页面所有数据内容onMounted(()=>{console.log("使用ref获取到的子页面中的数据是：",getSonMsg.value);});4.父页面完整代码这里是被定义的父组件01impo

不染-9732·2023-11-16 21:43

【Vue】过滤器Filters

hello，我是小索奇，精心制作的Vue系列持续发放，涵盖大量的经验和示例，如对您有用，可以点赞收藏哈过滤器filters过滤器已从Vue3.0中删除，不再支持了，这里可以作为了解进行学习vue3要精简代码

即兴小索奇·2023-11-15 03:07

在vue3.0项目中使用tinymce富文本编辑器

目录一、安装二、完整代码三、事项说明四、参考文档之前看了好几篇关于vue项目中使用tinymce的文章，import引入大量tinymce插件，/node_modules/tinymce下的部分文件搬运到public文件夹下（可能是以前只能用这种方法来实现吧），对于我来说，或者之前没用过tinymce，觉得这样操作起来就会麻烦，一不小心就可能会出错，后然直接看官方文档（英文），发现其实不需要什

mrjimin·2023-11-15 00:27

vue2、vue3、react虚拟domdiff算法的区别

vue3随着Vue3.0版本的发布，我们在使用或者对其源码进行阅读时会惊讶的发现，它又又又双叒叕变强了，尤大本人在直播中也提到新的Vue会比老的Vue有1.3到2倍的提升，它的更新机制会更加的快速敏捷。

奔跑吧、GZB·2023-11-14 23:57

总结Vue 团队开发的一些基本配置封装分享

本文已授权掘金开发者社区公众号独家使用，包括但不限于编辑、标注原创等权益简介本篇文章主要带来的是vue基础架构篇，大家都知道，Vue3.0后Vue2.0会有一个终结版出来，也就说明Vue迎来了新时代，但是并不是所有项目都能够一起迈向新时代的轮船

前端劝退师·2023-11-13 08:29

基于Element-ui 封装带分页的 Table

（ps：这是适配的vue2.0，如果使用vue3.0，对slot部分需要做一下调整）2023.03.17更新：简化table高度的设置方法，支持简单的跨页选择，支持排序，优化tableRenderHeader

Alice_hhu·2023-11-13 03:07

vue3.0出来了2.0还需要学吗,vue2.0和3.0区别大吗

vue2.0和3.0区别项目目录不同1、vue-cli3.o移除了config.文件夹。2、多了文件。3、新增了一个views文件夹。4、删除了static新增了public文件夹。5、移动到public了。配置项不同1、vue-cli2.0的域名配置，分为开发环境和生产环境。2、所以配置域名时，需要在config中的和。3、中分别配置3.0config.文件已经被移除。4、但是多了。env.pr

aifans_bert·2023-11-13 00:09

vue3.0二次封装el-table

实现效果：注意点：vue3取消slot-scope，改用v-slot，简写#。刚学vue3不久，语法不太熟悉，花了点时间。核心代码:详细代码://子组件{{scope.row.value}}import{defineComponent}from'vue';exportdefaultdefineComponent({props:{tableData:{type:Array,default:()=>{

一只小药锅·2023-11-11 19:16

android6 全局对话框,vue3.0自定义组件|vue3仿android/ios弹框|Vue3.x全局对话框

介绍前几天有给大家分享一个vue2弹框组件，今天主要分享的是Vue3.0实现轻量级移动端自定义弹出框组件V3Popup。V3Popup一款基于vue3.0开发的移动端自定义弹出层组件。

華先生·2023-11-11 14:05

vue3.0生命周期函数

什么是生命周期：vue中每个组件都是独立的，每个组件都有一个属于它的生命周期，从一个组件创建、数据初始化、挂载、更新、销毁，这就是一个组件所谓的生命周期。在vue2.x中的生命周期为beforeCreatecreatedbeforeMountmountedbeforeUpdateupdatedbeforeDestroydestroyedactivateddeactivatederrorCaptur

ey..·2023-11-11 14:59

vue3中生命周期函数

再过去几年里，我们一直停留在Vue2.x的学习和实践，而当下Vue3.0是Vue.js的最新版本，很多大厂已经开始转型Vue3.0。所以，我们必须紧跟时代步伐，熟练掌握并深刻理解Vue3.0。

尔嵘·2023-11-11 14:23

Vue3-学习笔记

目录一、创建Vue3.0工程1.使用vue-cli创建2.使用vite创建二、常用CompositionAPI1.setup2.ref函数3.reactive函数4.Vue3.0中的响应式原理vue2.

BlackStar-Coder·2023-11-11 11:17

大前端学习笔记 -- Composition API

CompositionAPI文章内容输出来源：大前端高薪训练营一、CompositionAPI使用1.使用Vue3.0先创建一个空文件夹，然后进入文件夹执行npminit-y，再执行npminstallvue

爱玲姐姐·2023-11-11 11:16

VUE3.0-常用 Composition API源自——学习笔记

、常用CompositionAPI官方文档:https://v3.cn.vuejs.org/guide/composition-api-introduction.html1.拉开序幕的setup理解：Vue3.0

sen丶晓森·2023-11-11 11:15

Vue3.0报错：Failed to resolve component el-form-item导致el元素无法显示

导入elementui时选择的是按需导入，需要在element.js中引入相应组件。import{ElForm}from'element-plus'import{ElButton}from'element-plus'import{ElFormItem}from'element-plus'import{ElInput}from'element-plus'importlangfrom'element-

m0_67265919·2023-11-11 09:42

关于vue3.0 引入 ant-design-vue 报错 Uncaught TypeError: Cannot read property ‘use‘ of undefined 的解决办法

其实很简单哈哈哈就是因为版本的问题根目录执行下面这个命令就行了cnpmi--saveant-design-vue@next-Scnpm和npm都行我把我main.js的内容粘出来方便大家复制import{createApp}from'vue'importAppfrom'./App.vue'importrouterfrom'./router'importstorefrom'./store'impor

魏天·2023-11-11 01:47

vue3.0 创建乾坤qiankun 微前端

1.前期准备工作1.1创建主应用1)vue新建主应用vuecreateqiankun-main2)创建src/components/father.vue恭喜你，看到我了，我是father页面exportdefault{name:'AFather'}3)src/router/index.js中添加路由信息import{createRouter,createWebHistory}from'vue-ro

红豆黄豆小甜豆·2023-11-11 00:57

vue3.0项目中使用mitt进行组件传值

一、安装依赖mittnpminstallmitt二、导出模块mitt在src目录下创建utils文件夹，在该文件夹下创建mybus.ts文件importmittfrom'mitt';constmitter=mitt();constbus:any={$emit:mitter.emit,$on:mitter.on,$off:mitter.off}export{bus}三、在main.ts中引入impo

Jeasu_0908·2023-11-10 22:36

Vue3.0路由拦截

全局路由器拦截：官方叫导航守卫index.js路由器import{createRouter,createWebHistory}from"vue-router";//导入vue-router路由模块,createWebHashHistor函数constroutes=[{path:"/",//路径:redirect:"/Films"//涉及到多级页面跳转需要用路径的跳转，不能用name的跳转;浏览器进

无盐海·2023-11-10 17:54

Vue3.0 声明式导航，编程式导航，路由，路由拦截案例

项目结构App.vue：根组件importTabbarfrom'../src/views/Tabbar.vue';//底部选项卡importHomefrom'../src/views/Home.vue';importFilmsfrom'../src/views/Films.vue';importCinemasfrom'../src/views/Cinemas.vue';importNotFound

无盐海·2023-11-10 17:54

Vue3使用vue-print-nb插件打印功能

Vue版本安装插件//Vue2.0版本安装方法npminstallvue-print-nb--savepnpminstallvue-print-nb--saveyarnaddvue-print-nb//Vue3.0

PaceMak1r777·2023-11-10 05:03

轻量状态管理工具 Pinia

什么是PiniaPinia和Vuex一样是专门为Vue设计的状态管理库，它允许你跨组件或页面共享状态，Api设计比Vuex更简单易学，且同时支持Vue2.0和Vue3.0。

诸葛亮的芭蕉扇·2023-11-10 01:19

As Const：一个被低估的 TypeScript 特性

asconst'TypeScript的期望与现实解决方案：'asconst'与object.freeze的比较一个配合'asconst'的更清洁的'gotoroot'函数使用'asconst'提取对象值基于Vue3.0

虚无火星车·2023-11-09 18:31

基于vue2使用vue-awesome-swiper 轮播图（踩坑记录）

1.安装Swiper2.注册swiper组件四、补充说明总结提示：本文介绍是基于vue2.0实现，如果您是vue3.0建议直接去swiper上按照官方文档使用哦。

T丶t·2023-11-09 15:19

Vue-cli创建Vue项目工程步骤详解

不过这里有一点大家需要注意，如果需要创建vue3.0的项目，我们需要使用最新的模板，所以需要保证我们的vue-cli的版本在4.5.13以上，我们可以通过以下的方式来查看我们电脑中的vue-c

一天吃、八顿·2023-11-09 14:10

前端进阶高薪必备：Webpack 及 Vite 原理剖析

在刚刚结束的VueConf2021中，除了Vue3.0以外，另外一个亮点就是下一代构建工具Vite了。在尤雨溪分享的【Vue3生态进展和计划】的演讲中，尤大神还特意提到Vite将成为Vue的现代标配。

前端达人·2023-11-09 14:04

Element Plus 千位分隔符

以下GIf动画是文档地址的演示使用pixiu-number-toolkit库优化Element-Plus组件Element-Plus是一个基于Vue3.0的桌面端组件库，它提供了丰富的组件和功能，可以帮助开发者快速构建应用

慕迅前端·2023-11-09 12:48

vue3.0 vite引入SVG iconfont

1.安装cnpmivite-plugin-svg-icons-D2.配置vite.config.tsimportviteSvgIconsfrom'vite-plugin-svg-icons';importpathfrom'path';exportdefault()=>{return{plugins:[viteSvgIcons({//指定需要缓存的图标文件夹iconDirs:[path.resolv

沐歌丨丶·2023-11-08 06:59

vue3使用vscode写uniapp引入uview-ui组件

-DCloud插件市场同时支持Vue3.0和Vue2.0，你没看错，现在uView支持Vue3.0了！

poguanba·2023-11-08 04:41

覆盖vue3.0的最全Vue知识点

声明：本篇文章纯属笔记性文章，非整体原创，是对vue知识的整理，对自己有很大帮助才分享出来，参考文章传送:1.童欧巴对vue知识的整理2.我是你的超级英雄对vue知识的整理3.vue官网基础篇说说你对MVVM的理解：Model-View-ViewModel的缩写，Model代表数据模型，View代表UI组件,ViewModel将Model和View关联起来。数据会绑定到viewModel层并自动将

weixin_45514905·2023-11-08 00:24

最全vue2,vue3知识点汇总

一、Vue基础1.Vue的基本原理当一个Vue实例创建时，Vue会遍历data中的属性，用Object.defineProperty（vue3.0使用proxy）将它们转为getter/setter，并且在内部追踪相关依赖

william毅·2023-11-08 00:50

前端er，你真的会用 async 吗？

async异步函数不完全使用攻略前言现在已经到8012年的尾声了，前端各方面的技术发展也层出不穷，VueConfTO2018大会也发布了Vue3.0的计划。

w18478272407·2023-11-07 18:10

(zichao)VUE3基础（仅作简单整理，未深入探究）

目录一、创建Vue3.0工程二、setup（一）理解：（二）作用（三）setup函数的两种返回值：（四）注意点（五）声明一个setup三、ref函数（一）作用（二）语法（三）操作数据（四）注意四、reactive

zichao_99·2023-11-07 14:47

VUE3.0,DAY61，VUEX模块化编码+namespace

VUE3.0,DAY61vuex模块化namespace总结vuex模块化在vuex的store核心库中，在actions、mutations、state在我们写了很多的逻辑函数代码。

疯子的梦想＠·2023-11-07 10:41

小黑子的——vue从入门到入土过程：第五章

vue.js零基础入门到vue项目入土5.0VUE2.0——VUE3.0系列第五章1.数据懒加载1.1运用vant库List组件加载1.2数据到底结束2.loading加载&axios拦截器2.1VueLoading

小黑子史蒂夫·2023-11-07 08:14

Vue3+Vite+Pinia+Naive后台管理系统搭建之四：Naive UI 组件库的安装和使用

前言如果对vue3的语法不熟悉的，可以移步Vue3.0基础入门Vue3.0基础入门快速入门。

yqcoder·2023-11-07 02:30

vue3.0生命周期详解

VUE3.0发布有一段时间了，最近学习了下生命周期与2.x版本相对应的生命周期钩子查看源码戳Vue2.xvue3beforeCreatesetup()createdsetup()mountedsetup

怪兽的猫·2023-11-07 00:38

composition API 和 Mixins

关于Vue3.0的CompositionAPI和旧版本的Mixins【转载】原文:http://caibaojian.com/vue3-composition-api.html在过往，如果你想共享组件间的代码

达文西_Huong·2023-11-06 11:54

前端Vue框架学习（一）基础内容总结

Vue是前端开发主流框架之一，对于开发者来说解决了好多细节问题，方便了开发，提高了效率，下面我就带来Vue2.0的一些基础的内容归纳总结，后期我会归纳Vue3.0的新变化文章参考：Vue基础概念Vue教程

一个刘·2023-11-06 10:20

vue3.0依赖注入

provide和inject用来向后代组件传递数组，也是遵循的是单项数据流看代码：在祖先组件中，定义provide数据，如果是响应式的，必须要用ref或者reactive来定义App根组件---{{money}}import{provide,ref}from'vue'importSonfrom'./son.vue'exportdefault{name:'App',components:{Son},

weixin_49696014·2023-11-06 03:56

vue3.0中的provide和inject 依赖注入使用方法

父组件向子组件传递信息,如果是多层组件嵌套(父>子>孙>孙孙…),props逐级透传十分麻烦,props可用但不优雅,更推荐provide/inject依赖注入的方式;在provide/inject依赖注入中父组件向后代组件通讯,如果说props是传递,逐级透传的,依赖注入是在父组件中与后代组件共享数据,可实现跨级共享;provideimportHelloWorldfrom'./component

不断学习的码农·2023-11-06 03:26

【vue3.0】依赖注入（provide和inject）

使用场景：有一个父组件，里头有子组件，有孙组件，有很多后代组件，共享父组件数据。父组件父组件{{money}}import{ref,provide}from"vue";importSonfrom"./components/Son.vue";exportdefault{name:"App",components:{Son,},setup(){constmoney=ref(100);constchan

别亦难�·2023-11-06 03:54

VUE3.0的404页面如何配置以及路由守卫

一、配置404页面router中增加一行这样的代码即可，关键要素：/:catchAll(.*){path:'/:catchAll(.*)',name:'404',component:()=>import("@/views/404.vue")}二、配置路由守卫router.beforeEach((to,from,next)=>{consttoken=storage.getItem('token');

我来秋风扫落叶·2023-11-05 14:22

proxy的使用场景

昨天电话面试有被问到vue3.0的特色是什么，想起了之前老师提过的proxy，但本人确实也不知道proxy的具体概念、原理和使用场景。google了一下，觉得下面这篇文章不错，贴来分享给各位，供翻阅。

易推倒DE小狼·2023-11-04 21:45

vue 3.0 使用ref获取dom元素

前言附上vue3.0文档：Vue3中文文档-vuejs2022.10.22更新鉴于较多人询问几个高频问题，在此做统一回复ref.value获取到的是null答：检查是否将ref变量return出去了答：

好巧.·2023-11-04 08:50

Vue3.0 provide与inject依赖注入：VCA

简介provide与inject是一种跨层级组件（祖孙）通信方式。当组件多层嵌套时，不需要将数据一层一层的向下传递，通过它俩可以实现跨层级组件通信。provide：提供者注入一个值，可以被后代组件接收。provide它接受两个参数：第一个参数是要注入的key，可以是一个字符串或者一个symbol。第二个参数是要注入的值。inject：接收者接收一个由祖先组件或整个应用(通过app.provide(

无盐海·2023-11-03 21:18

Vue3.0 VCA语法糖＜script setup＞ :VCA模式

简介：是在单文件组件(SFC)中使用组合式API的编译时语法糖。相比于普通的语法，它具有更多优势：更少的样板内容，更简洁的代码。能够使用纯Typescript声明props和抛出事件。更好的运行时性能(其模板会被编译成与其同一作用域的渲染函数，没有任何的中间代理)。更好的IDE类型推断性能(减少语言服务器从代码中抽离类型的工作)。语法糖用法基本语法：要使用这个语法，在script中添加setup属