有一个vue的右键菜单的需求，先上网查了一下是否有插件，比如下面这个1分钟Vue实现右键菜单https://www.jb51.net/article/226761.htm一顿操作之后，页面白屏，控制台报错，后来分析，大概应该是不适用vue3？ vue-contextmenu关于这个插件在网上找了很多用法，都以失败告终。还是自己动手造轮胎吧，正好也没做过这种东西。先上效果图：（仿windo
vue-Echarts公司最近做项目需要用到图表，以前是使用echarts,现在也是用这个，没什么好纠结的！ 但是最近发现以前每次做图表之类的都没有封装，每次做图表都要从新去配置之类的，写了好多重复代码，感觉很累啊，所以自己把图表封装成子组件使用，代码工作量减轻了很多，而且子组件使用了数据进行监听和图表自适应屏幕大小，这样以后会方便很多了！当然公司的项目肯定不能发出来了，我会做个简单的demo出来
一 在vue3项目里 如何使用element-plus组件库 1 下载element-plus插件npm i element-plus 2 main.tsimport { createApp } from 'vue'
import './style.css'
import App from './App.vue'
import router from './router/index'
前言最近刚刚结束项目，感觉收益颇多，因此记录一下，希望可以帮助到大家（我踩过的坑，大家就踩着我过去就行）背景本人java后端开发，公司临时需求需要弄一套权限管理系统，后端肯定没有问题，前端根据之前我使用的HTML,CSS感觉特别的繁琐和丑陋（主要本人不是专业前端），因此通过浏览相关资料，发现了vue+element+Admin(完美的后台前端解决方案)，它基于vue+elementui 实现，详细
下载element-admin框架点击该地址：https://github.com/PanJiaChen/vue-element-admin用git clone https://github.com/PanJiaChen/vue-element-admin或者直接下载压缩包都可以 2.安装依赖打开项目根目录，在根目录
一、效果二、解决el-table标头和表格滑动抖动问题element-ui2.15.9源码中有修改，但是element-ui2.15.9也有其他bug这里直接进行copy相关代码使用创建table集成element-ui的el-table<script>
// 继承自element-ui的table组件
import { Table } from 'element-ui'
import
vue3 接入 Element Plusvue3 发布已经很久了，官方也已经发布公告，自2023年12月31日起停止对 vue2 版本的维护更新，因此，vue3 正式登上了历史的舞台。组件库一直是前端开发的利器，减少了开发者开发复杂度，提高开发效率，在 vue2 中，最常使用的是 element-ui 组件库，在 vue3 发布之后，element-ui 也推出了针对于 vue3 版本的组件库 E
动态组件有的时候，我们需要在多个不同的组件之间进行切换。虽然我们可以通过 v-if 来处理，但是会比较麻烦，vue 提供了一个更方便的方式来处理这种情况一、component组件component 是 vue 内置的一个组件，它提供一个 is 属性用来动态渲染不同的组件1.1 v-if或v-show实现选项卡切换使用v-if频繁切换会频繁创建和销毁组件，消耗内存；且不会记住组件里的一些已
在移动端页面开发中，经常会去封装一个遮罩层（全屏弹窗），遮罩层（全屏弹窗），遮罩层（全屏弹窗）的组件，但是如果是固定定位的position：fixed；在弹出的时候会遇到一些小坑，之前搜索了一下，网上的博客也好评论也罢，总是有点缺陷或者累赘代码太多。就比如今天的主题，如何防止遮罩层（全屏弹窗）下方body内容继续滚动呢？移动端开发遮罩层（弹窗）防止滚动穿透完美解决方案首先，pc的肯定直接就给bod
在做vue开发的时候，会经常遇到下面的报错，那么这样的提示是如何实现的呢？ 为什么有这样的报错？是因为在模版(template)或者render函数中使用了没有声明过的属性或者方法。那么vue又是如何发现用户使用了未定义的属性呢？首先这段报错是出现在render期间，也就是触发update生成vnode期间，在源码中我们可以看到这样一段代码:try {
vnode = render.
Vue3脚手架指南在DOS命令行窗口下操作使用Vue3，必须安装node.js，执行如下命令，检查node环境： >node -v
v16.14.0 1.安装cnpm npm install -g cnpm --registry=https://registry.npm.taobao.org 2.安装脚手架Vue的脚手架名称由vue-cli改成了@vue/cli，如果以及全局安装了旧版本的v
一个vue.js的项目，另一个人想要买过去，但是需要换一下风格。一、需求换的东西不多，主要包括： 1、主色调：原来是紫色，需要换成浅蓝色 2、logo、一些背景色 3、一些操作按钮的颜色 4、一些menu和小图片二、分析1、后台逻辑和javascript逻辑上均没有改动，都是html、css层面的东西 2、此项目后续还要开发新功能所以，方案是基于一套代码做切换。三、开工1、首先在App.vue中加
虽然是标题是《vue实现列表自动滚动的方式》，但其它前端框架应该也可以通过这种方式实现，本案例中没有使用任何第三方插件，全部使用vue中相关的js、css以及定时器方式实现。 解决问题的第一步不是找代码，而是分析问题。列表自动滚动常见方式有两种（上下左右的滚动不赘述，只是方向的问题，本案例以向上自动滚动为例）：（1）
以前接触过一个后端管理系统， 叫H+， 偶尔发现它用的是左侧菜单没有滚动条， 于是， 我仔细查看dom， 发现H+ 左侧菜单的旁边有一个小的DIV， 我拖动的， 菜单竟然也能滚动， 我明白了， 这是用的虚拟滚动条， 我感觉这个挺不错的， 后来查看这个虚拟滚动条的源码， 发现是一个款叫做SlimScroll的基于jquery的库。由于我对Vue比较熟悉，所以，我想用Vue做一个类似的。不断踩坑一开始
接下来我们就以前面创建的mini-vue3为基础来实现Vue3新增的API，首先要讲的就是Composition API。什么是Compostion API呢？顾名思义，组合式API。相对而言我们在Vue2中使用的叫Options API，也即配置型API，我们的代码通过Vue给定的options，将代码写入到各个options中。比如mountd是虚拟dom装载完成之后的钩子，因此在SSR的服务
vee-validate vue-i18n vue-meta vue-pathify webfontloader world-map-vue chartlistmin.js全局引入使用插件 vue项目中直接调用即可1.vuetify我们今天推荐的是一款国外的框架：Vuetify
官方网站：https://vuetifyjs.com/zh-Hans/
有中国的为什么还要用外国的？原因如下：
一.前言 上一篇实现了整个框架的搭建和首页的编码，在此基础上，这一期进行了最终的功能页面完善，增加了功能：生活日志日志详情所有文章心情说说我的相册相册详情关于我标签合集同时对样式进行了更深层的改造和优化。二.页面效果图预览 文章详情： 心情说说+我的相册+相册详情 所有文章+标签合集三.路由配置import Vue from 'vue'
import Router from 'vue-router
在工作中我们经常会用到Tree组件，今天就来实现一个简易版的Tree组件，完整的代码请到仓库获取完整效果展示Tree 目录结构|-- tree
|-- index.ts 添加install方法导出
|-- src
|-- tree.ts prop类型
|-- tree.vue 模板
|-- tree.less 样式数据展示先来看看用户
搜索、分页要考虑哪些东西？单独拿出来一个来说，都是比较简单的，但是结合到一起再配合需求，就会出现种种变化，一不留神就会 ‘中招’ ！要把 分页 做成 搜索 ！分两个情况进行说明！注意： 以下情况均以每页10条数据为例。情况一：搜索出来的数据超过10条，即有多页符合条件的数据。1）假设用条件 “已审批的订单” 去搜索，结果一共有21条，共3页，此时是在第一页，他代表的是 “已审批的订单” 的1&nb
1、安装模板1.1、vue-cli3模板安装a 普通安装:npm install -g @vue/clib 淘宝镜像安装：cnpm install -g @vue/cli我这里使用的是普通安装：npm install -g @vue/cli1、首先打开命令窗口（window图标+R 输入cmd 弹出命令窗口）2、通过输入（磁盘名称:） 进入其他磁盘目录3、通过输入cd + 文件夹名称&
