- 博客(251)
- 资源 (2)
- 收藏
- 关注
RSS订阅翻译 element-ui弹框实现换行，el-tooltip换行
通过v-html 渲染字符串 最后添加 white-space: pre-line 即可实现 el-tooltip 换行，换行信息中的换行符使用\n。代码实现如下图所示，两种弹框都有尝试，都是可以实现换行的。方法一：需要使用v-html渲染。2、el-tooltip 换行。方法二：使用
2024-06-08 12:45:00
1947
1
原创 View 关于文本框可以输入e，表单验证不正确的问题
1、使用组件，但是这个有一个局限性，就是默认值value必须赋值为数字，而初始化不需要赋值时，这个好像有点不适用。【问题原因】：使用的组件为，这个时候按道理只能输入数字，但是字母e确可以确认，原因是e代表数字2.71828，他也是个数字，所以能输入。2、使用最基本的组件，这样的话文本框什么都可是输入，只是鼠标遗失焦点的时候判断输入是否合法即可。
2024-06-07 19:45:00
280
原创 View UI清除表单
这个起源于我项目中有一个for循环的表单验证，随着select的切换，后面input的表单验证也需要清除，如果使用上面的resetFields()，会将整个表单重置到初始化状态，所以需要使用resetField()),返回的数据中可以查看prop，prop就是我们vue页面rules:{}中写的表单验证，for循环遍历出我们需要清除的某个表单进行清除即可。首先，想要先爆个粗口，这个组件真的好难用，接下来看看清除表单验证吧，和element-ui一点都不一样。1、清除所有表单：resetFields()
2024-03-12 20:15:00
648
2
翻译 vue-element-admin实现后台接口返回路由，前端动态生成路由菜单
最近要开发新项目，与以往不同的是，路由菜单的生成都是需要后台管理的，接口直接返回给前端，前端根据接口的返回实现菜单及页面的显示。在菜单还没有给数据的时候，前端先自己在mock中模拟实现一下功能。
2023-11-18 15:30:00
3289
原创 micro-app在vue-element-admin中一些使用研究
本文主要是对微前端micro-app在vue-element-admin中的使用做了一些页面，包括路由的配置、子应用与基座之间的跳转、父子应用之间基座的同行、样式隔离、元素隔离、资源共享、组件共享等。
2023-05-07 17:16:08
2284
2
原创 基于micro-app+vue-element-admin实现微前端
本文主要讲述micro-app在vue-element-admin中搭建、打包、部署过程
2023-05-03 18:45:25
3187
14
原创 手把手教你使用vue2搭建微前端micro-app
本文主要讲述对微前端micro-app的手把手搭建过程，包括了从创建到运行的整个过程。适合新手操作
2023-05-03 17:05:16
5214
6
原创 micro-app的简单学习
本文主要是在micro-app搭建的基础上，参照官网，对micro-app的基础学习，包含如下内容：配置项、生命周期、环境变量、JS沙箱、样式隔离、元素隔离、数据通信、静态资源、预加载、插件系统、多层嵌套、高级功能、路由、应用之间跳转、打包、部署
2023-05-01 21:17:34
3762
1
原创 手把手教你使用vue创建第一个vis.js
手把手教你使用vue搭建第一个vis.js项目，npm install vis安装以及import导入vis
2023-03-16 18:00:00
2925
6
原创 vue文件下载
首先说明一下，在文件下载这边踩了个坑，花了好长时间才解决！就是后台给的接口返回的是一个二进制文件流，但是前端请求返回的结果将二进制文件流改成了字符串，所以导致下载一直不成功。这个方法是一个现成的下载组件，使用之前要先安装，在导入，然后跟方法二一样，接口调用成功后，调用方法fileDownload即可。如果你遇到文件下载不成功，且有使用mock.js的话，赶紧长点心，不然真的累死都不知道为啥一直下载不成功。接下来开始步入正题，我下面零零碎碎有好几种下载下载方法，大家可以根据自己的意愿选择下载方法。
2023-03-15 20:00:00
2236
原创 element-ui文件上传el-upload
el-upload文件上传，含进度条，添加进度条后如果文件未上传成功重新上传，进度条会不停的闪。中断请求即可。el-dialog关闭弹框时中断请求
2023-03-14 10:06:35
7914
3
原创 element-ui面包屑实现显示隐藏功能，而不是跳转链接
最近项目开发中有遇到一个需求，页面要实现面包屑的效果，但是实际上并不需要跳转链接，所以对面包屑做了一些修改。
2023-03-01 20:10:49
865
原创 vue点击按钮时，新增或删除一行表单元素
在项目开发中，有这样一个需求，点击按钮时，新增一行input文本框，且文本框后面有删除操作，点击删除还可以删除当前行。以上就简单的实现了一个前端的假新增删除操作。
2023-02-07 10:19:29
5111
原创 element-ui设置input默认成整型
原因是：即使声明变量时，定义的是整型，后期页面中如果修改输入框中的值，该字段的类型将会由整型变成字符串，导致提交后台时报错。但是后续开发中，发现设置type="number"有bug，比如可以输入字母e等一些奇奇怪怪的bug。:precision="0"是限制输入正整数，输入小数点的时候，在鼠标遗失焦点时，会自动对输入框中的数字四舍五入。由于项目中，对向后台传值的参数类型限制比较严格，所以在整型的配置上出现了一些问题。:controls="false"不显示组件自带的"+"，"-"操作。
2023-02-06 17:47:03
3173
原创 vue中使用v-for遍历v-model
从以上例子可以看出，我们遍历了key,label,value，在需要遍历的前面都有加上冒号“：”，所以在v-model的遍历中，需要注意的是，v-model前面不需要加冒号“：”。按照平时开发喜欢，页面中的每一个v-model都会在页面data中有一个对应的变量。那么遍历的v-model要怎样对应到data中进行表单提交呢？其实只要在data中声明一个变量，表单修改后，数据会自动更新到变量中去。
2023-02-06 15:03:01
1947
原创 vue-element-admin项目中，icon、svg图标的使用
在vue-element-admin中使用svg图片，下载svg图片，文件夹中查看svg图片
2023-02-06 14:09:57
4406
原创 vue实现路由跳转页面
vue跳转路由的方法有很多，我的项目中一遍用到以下几张方法，对此进行总结，方便下次在用的时候可以直接过来复制粘贴用。当然应该还有很多跳转方式，我这边只是总结了我项目中用到的跳转方法，后期应该会查缺补漏。3.可以通过点击事件，在js代码里实现跳转。1.点击文字，直接跳转页面。2.点击图标按钮跳转页面。
2023-02-03 17:14:41
1971
原创 element-ui 密码框显示小眼睛，点击可查看密码
在项目开发的实际需求中，用户有时候可能不确认自己输入的密码是不是正确的，所以想要查看一下自己的密码是否输入正确，这个时间就需要小眼睛，进行点击查看。
2023-02-03 15:04:59
5830
3
原创 element-ui tooltip的使用
在项目的开发中，有好多地方都需要对页面标签添加一些备注信息，方便用户可以更深入的了解内容的含义。，则提示信息出现在目标元素的左侧，且提示信息的底部与目标元素的底部对齐。总之，tooltip还是蛮好用的，项目中很多地方都有用到，即方便又美观。
2023-02-02 15:00:00
5658
原创 vue element-ui设置可填可选下拉框
在前端的项目开发中，好多地方都会用到下拉框，如果下拉框的内容比较少，用起来还是比较方便的，但是如果下拉框的内容比较多，有的时候需要快速的找到想要选中的内容时，有一个查询的功能还是很有必要的。element-ui有一个比较好的就是提供了可填可选的属性，这样用户可以自己输入内容查询，也可以自己手动选中，还可以自己输入下拉框没有的内容。总之，element-ui想要实现的一些功能，文档中几乎都有，遇到问题查看文档即可。只需要在select标签中加入filterable即可。
2023-02-02 13:23:25
5685
翻译 js正则，判断包含数字，小写字母，大写字母，特殊字符中的任意2种，任意3种，四种都包括
在项目开发中，关于密码的强度由用户自定义来实现。这样对密码的正则限制就需要动态判断进行限制。已知有数字、小写字母、大写字母、特殊字符4种。2.至少包含任意三种。1.至少包含任意两种。
2022-11-03 11:56:03
3351
原创 vue实现echarts树图修改节点图片，修改连线颜色，鼠标悬停显示详情，鼠标右键弹出菜单，搜索，导出PNG，高亮，查看节点是否还有子节点，修改树图的展示方式
其实这些效果之前都有用js写过，但是最近在写vue项目，里面的些许语法还是有些不一样的，所以还是写一遍文章总结一下，下次遇到就可以直接用了。：这个高亮的效果我感觉不是很好，但是如果有朋友需要的话，就是下面用法。下面简单介绍一下每种实现方式。如果想看js写法，可以看我。...
2022-08-12 22:44:33
6548
7
翻译 vue中使用类似html中a标签的锚链接，实现点击定位到当前页面的某个位置
vue中使用类似html中a标签的锚链接，实现点击定位到当前页面的某个位置
2022-07-02 20:16:57
3135
原创 echarts树图修改连线样式颜色，树的形状曲线和折线，树图边的曲度
echarts树图修改连线样式颜色，树的形状曲线和折线，树图边的曲度
2022-06-10 19:30:00
4796
12
原创 关于点击按钮，切换echarts树图的展示方式
echarts树图实现点击按钮的时候，切换树图的展示方向、echarts树图实现判断节点是否存在子节点、树图查询搜索、鼠标悬停显示详情、高亮、自定义节点等功能
2022-05-15 10:45:00
1906
原创 echarts树图自定义图片后，判断当前节点是否有折叠子节点
echarts树图自定义图片后，判断当前节点是否有折叠子节点、树图搜索、查询、自定义节点、高亮、鼠标悬停显示详情
2022-05-15 10:30:00
2114
原创 echarts树图设置高亮
首先说明一下，我最初用的echarts.js应该至少是两年前下载的吧，所以导致高亮写了半天一点效果都没有，最后实在找不到原因，就换了demo中的js。高亮的效果一下子就实现了实现效果如下：实现代码：emphasis: { // 高亮 focus: 'descendant'},代码结构：关于高亮的属性，在官方api中有看到以下属性，要么高亮本身，要么高亮祖先，要么高亮子孙，没看到一个可以同时高亮祖先和子孙的方法。文档地址完整代码：<!DOC...
2022-05-15 10:00:00
2805
3
原创 vue中mock.js树形结构tree
mock.js创建一个树形结构的数据，实现效果如下：代码结构如下：主要代码：（1）tree.jsimport Mock from 'mockjs'const tree = [{ label: '根部门', id: '0', children: [{ label: '市场部', id: '1', children: [{ label: '市场一部', id: '2' }, { label: '市场二部
2022-05-09 19:15:00
1403
2
原创 windows输入法输入英文字母中间有空格
平时生活中，偶尔会遇到windows输入法输入英文字母中间有空格解决方法：将输入法全角修改成半角即可1.鼠标右键2.设置半角经过如上操作后，在输入英文，就变正常了
2022-05-06 17:35:32
24540
原创 vue中mock.js初步简单使用
最近项目需要重构，在画原型的空隙简单了解了一下mock.js。因为从进度上看，后台接口不会很快 给到前端，那前端也不能坐着干等着。所以可以通过mock.js先造一些数据来实现效果mock文档地址一、首先当然是要先安装一下mock.js了npm install mockjs --save-dev二、在main.js中导入mock.js注:上线之前需要将其删掉import { mockXHR } from '../mock'if (process.env.NODE_ENV ===
2022-04-28 21:00:00
4466
10
原创 antv x6一些简单效果的实现总结
本文是对antv x6一个初步使用的简单总结，主要包括以下几点：1.实现画布的平移拖拽2.实现画布的layout方法3.实现画布的放大缩小方法4.实现画布的居中效果实现效果如下：完整代码如下：<template> <div> <button @click="zoomInFn">放大</button> <button @click="zoomOutFn">缩小</button>
2022-04-20 20:07:11
6801
2
原创 antv x6画布内容居中
一般情况下，我们使用antv x6画出的图形在画布中不是居中的状态，看上去很奇怪，所以需要一种方法来实现图形在画布中的居中效果在官网中找到如下方法：this.graph.centerContent()文档地址具体在代码中的使用方法如下图所示：这样，一个画布居中的效果就实现了...
2022-04-20 19:49:48
4175
原创 Antv X6画布缩放
首先在官网上查到关于画布缩放的知识，如下截图所示：接下来画布缩放这边，我是写了两个按钮，按钮点击时进行相应的放大和缩小代码布局如下：主要代码：<div> <button @click="zoomInFn">放大</button> <button @click="zoomOutFn">缩小</button> <div id="container"></div></div>.
2022-04-20 19:42:29
5584
6
原创 Antv X6 画布平移
Antv x6想要实现鼠标拖拽时平移画布，需要加上以下属性即可：panning: true // 拖拽平移代码布局：文档地址
2022-04-20 19:29:41
1479
3
micro-app在vue-element-admin中的使用
2023-05-07
本资源是基于micro-app+vue-element-admin实现的微前端
2023-05-04
micro-app-demo
2023-04-06
echarts.js ，看代码里面写的版本是2.0
2022-04-08
single-spa搭建
2023-03-10
TA创建的收藏夹 TA关注的收藏夹
TA关注的人