• Vue nextTick彻底理解

    前言含义和使用nextTick的官方解释:在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法,获取更新后的 DOM。啥意思呢,即我们对Vue中data数据的修改会导致界面对应的响应变化,而通过nextTick方法,可以在传入nextTick的回调函数中获取到变化后的DOM,讲起来可能还是有点梦幻,下面我们直接使用nextTick体验一下效果。比如我们有...

    Vue 2021年02月19日 44 1
  • tiptap - 基于 vue 的优雅流畅的富文本编辑器 Vue

    tiptap - 基于 vue 的优雅流畅的富文本编辑器

    一款专为 vue.js 打造,设计优雅,体验流畅舒服的现代富文本编辑器。关于 TiptapTiptap 是一款专为 vue 打造的简洁明快的富文本编辑器,通过简单的设置能为用户提供多种优秀的文字编辑体验。Tiptap 官网基于 vue.js 的富文本编辑器Tiptap 最大的特点是预置的渲染,没有任何 CSS,用户可以更全面地控制段落标记和样式视觉设计以及交互动效简洁明快,能够...

    Vue 2021年02月15日 89 0
  • Vuex 4 正式发布:打包现在与 Vue 3 一致

    Vuex 是一个专门为 Vue.js 应用程序开发的状态管理模式。Vuex 采用集中式存储管理应用的所有组件组件的状态。换句话说,Vuex 就是帮开发者存储多个组件共享的数据,方便开发者对其读取的更改的工具。Vuex 4 正式版本现已正式发布。Vuex 4 的改进重点是兼容性。Vuex 4 支持 Vue 3,并提供了与 Vuex 3 完全相同的 API,因此用户可以在 Vue ...

    Vue 2021年02月07日 89 0
  • Element UI 多选框组用法笔记 Vue

    Element UI 多选框组用法笔记

    今天给大家分享一下Element UI 多选框组用法笔记,直接上代码!<html> <head></head> <body> <el-form> <el-form-item label="兴趣爱好:"> <el-checkbox-group v-model="form.che...

    Vue 2021年02月06日 59 0
  • 在Vue3中点击链接下载文件 Vue

    在Vue3中点击链接下载文件

    我在用 Vue 3 重写我之前开发的 Vue 2项目的时候,在创建 Vue 3 的项目时没有直接在 HTML 里嵌入 vue 的 JavaScript 代码,而是通过 vue-cli 4.5.11 的方式创建的。发现它的项目文件的目录结构有所变化。那么在项目里需要提供一个功能,就是在点击 HTML 里的<a>标签后并不是进行页面的跳转,而是要直接下载文件。此时<...

    Vue 2021年02月06日 64 0
  • vue3中对computed,watch等方法的详解 Vue

    vue3中对computed,watch等方法的详解

    我们在使用vue3之前,先来看看vue2中mounted,computed,watch等都是怎么用的,钩子函数、计算属性computed和监控器watch,是我们在vue2中必不可少的必学方法,我们来对比学习看在vue3中如何使用,会加深我们的印象。请看下面的代码:<script> export default { data: { return {...

    Vue 2021年02月06日 145 0
  • 尤雨溪新品Vite的魔力,详解 Vue

    尤雨溪新品Vite的魔力,详解

    Webpack工具的出现是为了解决 ES Modules 模块系统本身的环境兼容问题、以及零散的模块文件导致的频繁网络请求发送和模块化发散的问题等等。既然已经有了 Webpack,尤大再整一个 Vite 到底有啥用呢?本质上,webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)。Vue 脚手架工具 vue-cli 使用 we...

    Vue 2021年02月05日 225 0
  • 前端:ElementUI+VUE 日期控件禁用用法 Vue

    前端:ElementUI+VUE 日期控件禁用用法

    今天给大家整理一下ElementUI+VUE 日期控件禁用用法,希望对大家有所帮助!HTML文件<el-date-picker v-model="value" type="date" :editable="false" placeholder="开始日期" value-format="yyyy-MM-dd" :picker-options="pic...

    Vue 2021年02月04日 78 0
  • vue3的ref、reactive、toRefs特性详解 Vue

    vue3的ref、reactive、toRefs特性详解

    了解ref()、reactive()这两个特性之前,我们先回顾一下vue2中data和method方法。在vue2中我们定义一个响应式变量name,通过点击事件handle来改变name的值是通过如下方式写的。这样只要name改变则界面相应的会发生改变,这就是数据的双向绑定。<template> {{name}} <template> <...

    Vue 2021年02月04日 190 0
  • 封装一个基于Vue的评论留言编辑器组件 Vue

    封装一个基于Vue的评论留言编辑器组件

    基本介绍现在市面上有非常多的基于 Vue 的组件库,但是看了好多都没有发现有关留言评论的组件,这对于想做一些文章信息展示类的项目可就显得棘手了,因为有太多的页面需要这个功能了,难道我们需要重复的去写(复制粘贴)这些代码吗?对于现在模块化体系逐渐完善的前端工程项目来说,一次性封装一个通用功能的组件式非常有必要的,那现在我们就去封装这样一个组件吧!必备技术(Vue)由于封装的组件式...

    Vue 2021年02月03日 74 0
  • 如何使用Select组件封装成级联组件 Vue

    如何使用Select组件封装成级联组件

    前言因为工作内容变更的原因,在20年的时候,我的前端技术栈由Angular转移到了Vue。 它们都是现阶段比较火的前端框架,在一开始的时候,需要快速地转换一下组件设计的思想。到现在也有半年多的时间了,我现在的前端技术栈主要如下:前端框架:Vue 2UI框架: Element UI开发语言: TypeScript使用这些技术,不断地开发、封装一些项目中的组件,乐此不疲。需求在项目...

    Vue 2021年02月03日 84 0
  • ElementUI:文本框实现远程搜索的用法 Vue

    ElementUI:文本框实现远程搜索的用法

    今天继续给大家分享一下Element UI 多选框组用法笔记,直接上代码!1、HTML<el-form-item label="用户列表"> <el-autocomplete class="inline-input" @clear="clearUser" clearable ...

    Vue 2021年01月30日 90 0
  • vue 监听 全屏退出事件 Vue

    vue 监听 全屏退出事件

    解决1["fullscreenchange", "webkitfullscreenchange", "mozfullscreenchange"].forEach((item, index) => { window.addEventListener(item, () => { // 执行的操作 }); });

    Vue 2021年01月30日 74 0
  • Vue.js添加全局过滤器的几种方法 Vue

    Vue.js添加全局过滤器的几种方法

    过滤器基础知识Vue.js 允许你自定义过滤器,可被用于一些常见的文本格式化。过滤器可以用在两个地方:双花括号插值和 v-bind 表达式。<!-- 在双花括号中 --> {{ message | capitalize }} <!-- 在 `v-bind` 中 --> <div v-bind:id="rawId | formatId">&l...

    Vue 2021年01月27日 96 0
  • 从零开始学VUE Vue

    从零开始学VUE

    Vue.js作为目前最热门最具前景的前端框架之一,帮助我们快速构建并开发前端项目。 本文旨在帮助大家认识Vue.js,了解Vue.js的开发流程。本节导航Vue CLI安装创建项目启动打包环境变量Vue生命周期Data模板语法复杂业务组件常用库Element安装配置栅格系统Form 表单Table 表格Vue CLIVue CLI 是官方提供快速搭建Vue项目的脚手架工具零配置...

    Vue 2021年01月25日 141 0
  • vue前端根据菜单数据生成当前路由的面包屑 Vue

    vue前端根据菜单数据生成当前路由的面包屑

    这段时间做了个项目,之前的前端直接用vue路由的matched参数生成面包屑,我接手项目后,发现这样生成面包屑有时候不太准,就封装了个从菜单数据里生成面包屑的方法,分享给大家,大家有其他更好的方法也可以分享出来!图一是菜单数据的json结构图二是封装的方法path:当前页面的路径!必填menuData:菜单数据!必填最后返回的是由菜单数据生成的面包屑数组!子菜单层级无限!

    Vue 2021年01月23日 132 0
  • 记录基于vue在我的真实项目中的性能优化 Vue

    记录基于vue在我的真实项目中的性能优化

    最近一段时间一直在处理公司的一个内部项目哈,因为页面卡的问题被吐槽了一个月了。因为是接手别人的项目,虽然说不是自己直接造成的。但是解决这个问题已是迫在眉睫了。可能我们在做前端开发的时候,很少去关注内存的问题,这是因为JS有自己垃圾回收机制,如果代码不是滥用闭包,一般来说,不会出现性能问题。先来大概说下我的项目中性能瓶颈的现象:项目是一个基于electron+vue的一个类似微信...

    Vue 2021年01月23日 119 0
  • Vuex状态管理插件

    一、引言在Vue.js的组件基础中,我们在两个组件之间传值使用的是props(父组件向子组件传值),自定义事件this.$emit方法(子组件向父组件传值),对于简单的组件比较少的,而且依赖不复杂的我们可以使用,但是,如果组件很多,而且依赖很复杂,两个组件不一定是父子关系,而且关系比较远的时候,如果我们还是使用传统的传值方式,那将会是一场灾难(两个距离比较远的组件如果使用传统方...

    Vue 2021年01月21日 111 0
  • 快速入手vue3.0新增常用API,起步上车 Vue

    快速入手vue3.0新增常用API,起步上车

    1. 初始化项目2. setup方法 setup是vue3.x中新的操作组件属性的方法,它是组件内部暴露出所有的属性和方法的统一API。setup的执行时机在:beforeCreate 之后 created之前,可以接受props数据ctx上下文对象(这些属性在 vue 2.x 中需要通过 this 才能访问到,在 vue 3.x 中无法访问到 组件的this)。3. reac...

    Vue 2021年01月20日 135 0
  • MyUI-新德汇出品的基于Element的中后台项目工程框架 Vue

    MyUI-新德汇出品的基于Element的中后台项目工程框架

    基于 Vue + Element UI 构建的中后台工程框架,专业美观,内置组件丰富。关于 MyUIMyUI 是一款由新德汇出品的基于 Vue + Element UI 构建的工程框架,专注于中后台管理系统快速搭建。喜欢 Element UI 的小伙伴,现在终于有了一个颜值在线,综合素质优秀的 admin UI 框架了。MyUI 演示预览框架特点搭载的代码生成器可生成底层 ap...

    Vue 2021年01月07日 363 0
  • 基于 Vue3 后台管理平台Vue3.x-Admin Vue

    基于 Vue3 后台管理平台Vue3.x-Admin

    今天给大家分享一个Vue3.0框架搭建的后台管理模板Vue3.xAdmin。vue3.x-admin 使用vue3开发的后台管理系统。主要包括CSS3特效、可拖拽的div、图表、益智小游戏、vuex4.x 存储用户信息等功能。技术栈Vue3.x + vue-router4.x + vuex4.x + Less + Echarts目录结构快速安装通过如下步骤快速本地构建项目。# ...

    Vue 2021年01月07日 922 0
  • 基于 Vue+Spring 前后端分离管理系统ELAdmin Vue

    基于 Vue+Spring 前后端分离管理系统ELAdmin

    今天给大家分享一款超棒的Vue前后台分离管理模板ElAdmin-Web。eladmin 一个简单易上手的Vue+Spring boot后台管理框架,star高达2.6K+。支持主流电脑、平板、手机等设备。特性技术栈:使用 SpringBoot/Jpa/Security、Redis、Vue、ElementUI 等技术开发;模块化:后端采用按功能分模块开发方式,提升开发,测试效率;...

    Vue 2020年12月26日 393 0
  • 如何快速用Vue-element-admin撸了个管理后台 Vue

    如何快速用Vue-element-admin撸了个管理后台

    最近一个朋友找我开发一个用于库存管理的后台,虽然逻辑并不是很复杂而且系统也并不是很大,但是因为存在一些定制需求,所以就希望通过自行开发,而不是直接使用目前市场上的库存管理后台。我也正好最近在研究一些新的前端框架,这次开发周期并不是很紧,所以也就正好可以给我对于一些之前没有使用过的前端框架练练手。为什么选vue-element-admin因为有段时间没有直接开发PC端前端项目了,...

    Vue 2020年12月18日 813 0
  • 跨端框架 RAX 初体验 Vue

    跨端框架 RAX 初体验

    锵锵锵~ 小伙伴们,新出的会议室预约系统用着还顺手吗?快告诉我,对比之前的古老预定方式是不是方便很多?系统响应快不快?界面是不是一目了然?交互方式友好吗?看着每天预约人数这么多,无疑答案都是肯定的。那你有没有预约个会议室来把玩一下?预约网红会议室像不像淘宝双十一的大抢购?悄悄告诉你,会议室预约系统采用的前端框架,就是淘宝双十一的 Rax。爱学习的你一定嗅到了知识的味道~那什么是...

    Vue 2020年12月16日 332 0
  • 基于vue和JsPlumb的流程设计器——easyflow Vue

    基于vue和JsPlumb的流程设计器——easyflow

    介绍easyflow是一个码云上开源的一款流程设计器项目,基于VUE+ElementUI+JsPlumb,通过 vuedraggable 插件来实现节点拖拽。仓库地址https://gitee.com/xiaoka2017/easy-flowhttps://github.com/BiaoChengLiu/easy-flow功能概述支持拖拽添加节点点击线进行设置条件支持给定数据加...

    Vue 2020年12月15日 787 0
  • VUE 实现高性能的 PDF 在线预览 Vue

    VUE 实现高性能的 PDF 在线预览

    最近在实现共享 PDF 文档的需求,存在主讲人这样一个角色,上传 PDF 文档后,通知其它连接中的终端,进行实时同步展示的功能。对于这样的需求,pdf.js 成功的让我想起了它。PDF 文档的预览,总的就是要加载速度快,尽最快的速度完成渲染,呈现给用户看,不要出现长时间的白屏或 Loading 状态的现象,另外 PDF 文档需要支持翻页等操作。具体看看一步步的实现。文档分片下载...

    Vue 2020年12月14日 503 0
  • 自定义ElementUI选择器选项样式的方法 Vue

    自定义ElementUI选择器选项样式的方法

    前言最近接了一个需求,基于 ElementUI的选择器,自定义符合需求的样式出来,笔者最终顺利完成了需求,其中踩了不少坑,写本分分享下案例首先展示下本demo的代码结构,以便后续观具体代码,心中数本项目是基于 ElementUI 的 Starter,这个可以开箱即用,里边搭建好 Vue,ElementUI的架子,方便开发者进行后续的开发,不用浪费精力在配置上,具体地址如下:ht...

    Vue 2020年12月14日 330 0
  • Vue学习笔记之路由的keep-alive应用及技巧 Vue

    Vue学习笔记之路由的keep-alive应用及技巧

    keep-alive的应用:作用:keep-alive是Vue内置的一个组件,可以使比包含的组件保留状态,或避免重新渲染,而router-view也是一个组件,如果直接被包在keep-alive里面,所有的路径匹配到的视图组件都会被缓存。生命周期:· 初次进入时:created > mounted > activated;退出后触发 deactivated· 再次进...

    Vue 2020年12月14日 206 0
  • Element UI 框架中表单数据的验证方式

    前言Element UI 框架中的表单验证使用 async-validator(异步校验)第三方库实现,该库在 GitHub的地址是 https://github.com/yiminghe/async-validator,至今在 GitHub 上已经有了 5.1+的 star,是多 款 前 端 框 架 使 用 的 表 单 验 证 机 制 。 该 库 在 npm 中 的 API ...

    Vue 2020年12月09日 207 0
  • Vue Router 4.0正式发布!焕然一新 Vue

    Vue Router 4.0正式发布!焕然一新

    今天,Vue Router 4 正式发布稳定版本。在经历了 14 个 Alpha,13 个 Beta 和 6 个 RC 版本之后,Vue Router v4 闪亮登场,为你带来了 TypeScript 集成、新功能以及对现代应用程序的一致性改进,已经准备好成为 Vue3 新应用的最佳伴侣。将近 2 年的时间,大约 1500 次提交,15 个RFC[1],无数的心血……以及许多用...

    Vue 2020年12月09日 1553 0