通过Vue编写一个二级，并且是可以折叠的导航菜单 文章目录思路在main.js中 配置axios导入element样式Home.vue实现静态页面、样式及功能 思路在侧边栏区域只写了一个二级导航，通过axios获取到侧边栏的数据，通过v-fot循环渲染该数据，形成多个二级菜单 使用elemen-ui进行样式的设置在main.js中 配置axios导入axios包配置请求的根路径把axios包挂载到
转载
2024-03-25 07:57:35
1264阅读
避免不了使用table,当然table单纯只是展示list数据,项目中遇到需要在table的row中在嵌套一个表格,由于接口做了拆分功能块比较独立,需要先获取list,当点击相应row展开折叠框的时候在获取row对应的下级数据,row还提供编辑功能,修改完之后再次获取list列表。如果同时展开两个折叠框会对table里面嵌套type="expand"的el-table-column里面数据有影响,
转载
2024-05-21 20:45:49
1319阅读
MUIMUI概述：MUI是一款APP的前端框架 进入官网可以浏览更加全面的APIMUI官网特点： 追求性能体验，是启动MUI项目的首要目标，轻量必然是重要特征； MUI不依赖任何第三方JS库，压缩后的JS和CSS文件仅有100+K和60+K第一个MUI项目：打开HBuilder，右键新建项目选择APP，选择带有mui项目的模板就可以生成第一个mui项目 创建好后自动生成一些文件 打开首页后里面自动
2021.9.1坑57（组件
折叠）：简单实现向左
折叠，无动画。效果是点击带箭头的长条（加了背景色方便查看）改变
折叠状态。思路是外层包裹flex自动左到右排列，使用v-show控制内层元素显示，图标使用@element-plus/icons。<template>
<div class='viewBox'>
<AItem v-show="isS
转载
2024-03-01 19:22:13
304阅读
最近在做Lodop打印功能:思路是: 用MasterPage搭个打印页面的框架, 然后在具体的页面中填入数据, 打印的样式由母版页和CSS来控制.困扰了一天的问题是: 在打印的JS文件中, 引用外部css文件时, 需要拼出实际的含有IP地址的CSS文件地址, 并且需要用双斜杠(//)来代替单斜杠. =====后来遇到的问题: css文件里的样式, 在页
目录一、实现效果二、原理1. 折叠菜单栏2. 面包屑三、全部源码：我的折叠菜单栏+面包屑 一、实现效果动画演示效果 之前的登录+++++++++++++++++++++++++++本次：折叠菜单栏+面包屑此部分全部源码见本文末或github：Cungudafa:Vue_SpringbootDay3二、原理1. 折叠菜单栏参考链接：element-ui 官网api：https://element.
转载
2024-03-27 08:24:05
430阅读
vue中，右键菜单组件v-contextmenu的使用1、效果右键菜单之禁用和子菜单2、流程第一步：安包npm install v-contextmenu --save-dev
npm install --save vue-runtime-helpers第二步：引入src/main.jsimport contentmenu from 'v-contextmenu'
import 'v-contex
转载
2024-10-13 18:45:38
263阅读
精彩回顾如何实现H5可视化编辑器的实时预览和真机扫码预览功能在线IDE开发入门之从零实现一个在线代码编辑器基于React+Koa实现一个h5页面可视化编辑器－DooringTS核心知识点总结及项目实战案例分析前言本文是继 前端如何一键生成多维度数据可视化分析报表 实战的最后一篇文章, 主要介绍如何实现后台管理系统的权限路由和权限菜单. 希望通过这3篇文章的复盘和实战, 可以让大
今天我们继续使用 Vue 的撸我们的实战项目，只有在实战中我们才会领悟更多，光纸上谈兵然并卵，继上篇我们的《Vue一个案例引发的动态组件与全局事件绑定总结》 之后，今天来聊一聊我们如何在项目中使用递归组件。信息的分类展示列表这次我们主要是实现一个信息的分类展示列表存在二级/三级的分类，如下如所示：看到这个很多人会想到这个实现起来很简单啊，来个嵌套循环不就完事了。对，你说的没错，事实就是这样简单。那
1.一个完整的组件项目需要什么？必要的：组件构建方式 ( webpack / rollup 之类 )，并提供至少一个主流的输出格式 (ESModule)Demo 及 Demo 源码文档，可以是 docsify 之类的生成的页面，懒点就内嵌在 README 里了其实上面的除了文档都比较容易做到，除了可能会在构建上踩坑外。那么做到了这些可以上线了吗？是的。不过看一些优秀的库其实还可以做更多的，例如下面
转载
2024-08-31 09:23:48
303阅读
参考如下：https://element.eleme.io/#/zh-CN/component/menu先直接遍历路由列表，显示需要显示的导航元素。 <el-menu :default-active="$route.path" mode="horizontal" @select="handleSelect"> <template v-for="(ite...
原创
2021-07-14 11:43:29
2269阅读
前言：首先，我们需要知道，动态路由菜单并非一开始就写好的，而是用户登录之后获取的路由菜单再进行渲染，从而可以起到资源节约何最大程度的保护系统的安全性。需要配合后端，如果后端的值不匹配，做成动态路由会很复杂。第一部分： 获取到用户渲染的菜单路由数据1.用户登录成功，获取到用户的菜单路由。res.meauList（用户菜单数据） 2.菜单数据格式:"meauList": [
组件 <template> <div class="hide-page-com"> <ul class="tab-tilte"> <li v-for="(title,index) in tabTitle" :key="index" @click="getclcik(index)" class="me
原创
2022-09-01 20:18:31
624阅读
在我们做管理后台亦或是产品流程时，总是需要一个菜单栏或者导航栏来架起我们的产品架构，那么，如何用vue实现侧边折叠导航栏呢？接下来将一一介绍。 &nb
转载
2024-06-25 09:17:23
109阅读
代码简介：JavaScript纯文字折叠菜单，类似淘宝网一样的管理菜单，非常纯净，如果你想为每个菜单加上背景，你可以修改CSS中调用的一个GIF图，改变图片的样式就可以改变背景，实用方便。代码内容：<html>
<head>
<title>JavaScript实现的文字折叠菜单代码_网页代码站(www.webdm.cn)</title>
<sc
转载
2023-06-30 08:35:17
117阅读
最近项目重构，因为之前一直在使用 vue-element-admin 框架，但是该项目的定位是后台集成方案，不太适合当基础模板来进行二次开发。因为该项目集成了很多你可能用不到的功能，会造成不少的代码冗余。如果你的项目不关注这方面的问题，也可以直接基于它进行二次开发。作者这里用的是 vue-element-template 版本，有什么需要都可以去 vue-element-admin 复制。 集成方
转载
2024-05-13 19:08:41
135阅读
OthersDialog 对话框 基本用法<el-button type="text" @click="dialogVisible = true">点击打开 Dialog</el-button>
<el-dialog
title="提示"
:visible.sync="dialogVisible"
width="30%"
:before-close=
问题讲解：在使用vue版本的ElementUI中的table功能的时候还是遇到了一些问题，可以说饿了么团队在这个UI框架的文档撰写已经非常不错了，不过还是有一些方法乍一看让人摸不着头脑，有些table的常用功能示例代码提供的不是非常详细，所以这次针对这个可展开表格实现手风琴效果写一篇博客探讨一下。 先展示一下ElementUI官方提供的示例代码效果图可以看到官方代码中在这边没有让这个可展开tab
转载
2024-04-19 16:26:44
425阅读
目录效果如下这个功能主要是靠elementUI的tab+Vuex来实现的，下面就来介绍如何实现的思路：首先我们正常点击菜单跳转页面是靠路由实现的，然后我们需要点击菜单生成tab页和设置显示的tab页，所以我们需要用Vuex定义一个数组options，用来存放添加进去的tab页，还有一个设置显示哪个tab页的属性activeIndex，所以在点击时我们把这个页面的信息存放到options里面...
原创
2021-09-02 11:13:09
2089阅读
鼠标可以说是一个划时代的发明了，通过左右键的使用，基本囊括了PC操作中的一些常见动作，远远要好过触摸屏的点点点，手势识别等。FileMenu Tools是一个加强邮件菜单的工具软件，非常的实用跟方便，支持自定义设置，好好研究透了的话，提高效率等等都不在话下。FileMenu Tools支持自定义如下的功能：激活运行外部应用程序复制/移动到特定文件夹删除特定的文件类型将选定的文件作为附件发送到电子邮
