- 博客(97)
- 收藏
- 关注
RSS订阅
原创 一些常用的东西
清除浮动css.clearfloat:after{display:block;clear:both;content:"";visibility:hidden;height:0}
2019-10-10 15:42:36
210
原创 vue中,(iframe)如何实现一个页面跳转链接,点击链接不是新开一个页面,而是在当前页面显示
昨天突然来一个需求,管理系统中,点击页面返回的接口信息,是一个链接,但是你不能去跳转到另一个页面,而是点击的时候,如果有这个链接,在当前页面进行显示,就像是这个页面的内容一样。样式也要携带进去,完美解决!我们用到的有iframe。
2024-03-07 10:53:33
332
原创 elment-ui部分ui组件在移动端也能实现自适应
最近有移动端的项目迁移到pc端,pc端那一套用的是element-ui的后台框架,所以难免有一些样式不兼容的问题,之前很久的时候也处理过这些,但是很久没处理忘了==,这个我直接用的是layout布局,手写div整上去的,目前遇到这俩,之后有了多更新。
2023-11-30 10:26:10
2867
2
原创 小程序项目在hbuilder里面给它打包成app
小程序项目临时有些登录需求，需要把（小程序某些功能通过条件编译让它显示到app上）小程序打包成app的话就必须需要一个打包的证书，证书的话就要去重新生成，苹果电脑可以去自动生成证书，平时是用windows进行开发的所以就要借助第三方工具（香蕉云编）去生成证书，但是小程序打包成app，还有一些一些app不兼容的插件，识别不到插件路径等，明明小程序上是成功运行的，但是打包成app就会报错，识别不到那个插件，这个目前在排查，等排查好了在总结。密码随便填写，点击下载 就会生成一个p12证书，我们的证书就生成好了。
2023-03-06 12:43:51
1460
原创 vue中管理系统首页改造pc端和移动端都能显示自适应
判断当前设备是手机端或者pc端，根据设备展示页面 在项目中经常会遇到支持 pc端 与手机端的需求。端和手机端尺寸差距很大，一个文件很难实现这种需求。这个时候就需要判断当前的设备，根据设备来跳转不同的路由。根据这种不同的页面，进行适配两套，在移动端以及pc端的展示，成功解决。在 App.vue 中判断当前设备进行跳转路由。
2023-02-27 13:40:48
2118
原创 Hbulider上如何打包
点击打包，就进入一个等待的过程，5分钟或50分钟不等。选择一个比较人流比较小的时间点，中午大概就可以打包好。因为前端开发是在测试环境上进行开发代码的，开发完再去看你开发的效果，这个要在哪里看呢？https://www.pgyer.com/ 这个里面去发布到我们的手机。就会跳转到发布应用，把刚才打包好的那个包拖拽过来就可以了。苹果的较麻烦，还需要获取一个uuid权限这个整好后总结。之后就生成了二维码可以进行下载，此为安卓的方法。进入到控制台 就可以看到你刚才打包的版本了。从详情进去，点击更新。
2022-10-27 09:36:44
1618
原创 elemet-ui的树结构使用lazy load搭配加载数据，以及默认选中一级节点
html代码： <!-- 左侧树结构部分 --> <div class="outsideBox"> <div class="treeClass"> <el-tree ref="tree" :data="data" :highlight-current="true" :default-expanded-keys="
2022-04-14 11:48:31
2330
原创 element-ui及时清除验证规则
误区之前使用的一直是重置表单(this.$refs[formName].resetFields(); )还是会报红,正确的使用方法使用清除验证(this.$refs[formName].clearValidate(); ),但是使用这个的时候要注意还要清除表单数据,尤其是在点击el-dialog的关闭事件和表单的取消按钮时候,不然会出现打开弹窗时,虽然没有报错,但是还有有值的bug;处理的思路先写一个重置表单的公共函数;再调用这个函数,提高函数复用...
2022-03-03 09:38:45
1657
原创 css 文本两行显示，超出省略号表示
重点：text-overflow: ellipsis;只对display：inline；起作用例子：a{display:block/inline-block;width:100px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}b{display:inline; //正确display：inline-block //错误，b标签里的字超出不能显示省略号（…）}//一行white-space: nowra
2022-02-22 14:54:58
1034
原创 vscode格式化
//将设置放入此文件中，以覆盖默认设置{/* Easy Sass插件 /“easysass.formats”: [{“format”: “compressed”, //压缩“extension”: “.css”}],“easysass.targetDir”: “./src/styles”, //自定义css文件输出路径/ 此配置支持 CSS、HTML、JS 和 Vue 等文件的格式化网 */// tab 大小为2个空格“editor.tabSize”: 2,// 100 列后换行
2022-02-21 15:40:54
257
原创 element-ui改造表格样式
element-ui中没有只有外边框，我内边框不要的表格 所以就做了下小改造改造之后的效果：代码 <el-table class="table-detail" :header-cell-style="{ background: '#F7F8FA', color: '#333333' }" :data="tableData" style="width: 100%" > <el-table-column pro
2021-12-13 11:03:47
2296
原创 iview中的表格render搭配使用Tooltip 文字提示
iview这个库用的很少，虽说很多ui库都是一样的，element-ui是使用template里的插槽 用的较熟悉一些，iview的是需要搭配render使用， 所以自己看了一下网上的，都不是我要的效果，就自己梳理了下效果如下图：在这里插入图片描述自己这边也应用了两行在换行 超出…显示data 你的表格数据中： { title: '申请描述', key: 'name', width: '300px', r
2021-12-10 10:57:30
2588
原创 js，vue中限制文本框只能输入数字小数点
<el-input v-model=“item.money” @keyup.native=“UpNumber” @keydown.native=“UpNumber” />//代码UpNumber(e) {// 输入框中只允许输入数字e.target.value = e.target.value.replace(/[^\d]/g, ‘’)// 输入框中只允许输入小数点和数字，小数点后只能跟一位e.target.value = (e.target.value.match(/^\d*(.?
2021-11-25 14:43:46
936
原创 vue导出文件，前端处理后台返回的数据获取json不全的问题
链接：https://www.cnblogs.com/min77/p/13858415.html 解决
2021-11-18 17:13:00
508
原创 vue保留两位小数
@keydown.native="handleInput2" handleInput2 (e) { e.target.value = (e.target.value.match(/^\d*(\.?\d{0,1})/g)[0]) || null console.log(e.target.value); },
2021-11-15 15:35:14
1840
原创 element-ui 解决在IE（ie）浏览器下选择高度会出现空白的问题
测试在测第二轮 ie浏览器下，elemnt-ui的表单出现了以下这种情况仔细检查样式发现，el-select的高度为50px(正常的)，但是其直接父级.el-form-item__content的高度就是50.8px。select和父级本身都没有样式语句导致这个现象。至于是为什么，我也还一头雾水。不过多次尝试后发现了以下解决办法：给el-form-item__content加上display:flex;...
2021-09-07 14:46:41
463
原创 element-ui 使用load进行加载
(红框为机构，下面没圈的为部门)需求是这样的， 后台返回的数据中，tree结构有的返回子节点数据了，有的没有返回子节点数据，需要在点击的时候 调取接口，在进行加载当前父节点下的子节点数据所以，这个时候就可以使用load进行加载节点这里只用关注 lazy :load=“loadNode” （两者搭配使用，否则没有效果） 具体可以看官方文档html代码 <el-tree ref="tree" :data="data" lazy :load="loadNode" :hig.
2021-09-03 16:45:38
1920
原创 element-ui默认设置tree根节点展开并为选中状态
html代码：主要用到三个组件中的属性：1：:highlight-current=“true” 设置选中颜色的2：:default-expanded-keys=“idArr” 设置默认展开的3：:default-checked-keys=“idArr” 设置选中的具体介绍可以去看官方文档 <el-tree :data="CatlogTreeData" node-key="id" ref="treeFather" :highlight-current="true" :default-
2021-09-01 14:56:57
3854
原创 element-ui限制只能输入数字小数点保留两位
用element-ui的number修饰符的话， 是可以达到只能输入数字的效果，但是同时它把e也算进去了，算是数学的科学计算法把…所以限制了一下文本框的，可输入小数点，数字<el-input v-model="addForm.cgxe" oninput="value=value.indexOf('.') > -1?value.slice(0, value.indexOf('.') + 3):value" type="number" placeholder="采购限额" maxlength
2021-09-01 10:29:39
1746
原创 element-ui实现表格按照第一页的顺序点击分页自动排序
代码html代码直接 prop绑定index即可 <el-table-column property="index" label="序号" width="50"> </el-table-column>获取数据的方法 // var newItem =res.data.data.list.forEach((item,index) =>{ //res.data.data.list 表格数据 forEach为
2021-08-26 14:30:20
246
原创 递归方式拿树结构的子项item的id数据
后台返回的格式[{"name":"xxxxxxx集团","id":"001","items":[{"flag":"false","name":"普通用户岗（分散采购）","id":"8a86a6197ae1cd61017ae1d23f6a0001","items":[]},{"flag":"false","name":"系统管理岗（分散采购）","id":"8a86a6197ae1dea0017ae1ed8a050003","items":[]},{"name":"xxxxxx有限公司","id":"10
2021-08-20 10:38:10
396
原创 限制按钮只向后台发一次请求的节流防抖
jsexport function Dobounce(fn, t) { let delay = t || 500; let timer; return function () { let args = arguments; if (timer) { clearTimeout(timer); } timer = setTimeout(() => { timer = null; fn.apply(this, args);
2021-08-19 20:28:17
125
原创 element-ui拿到可选择的树结构id,以及default-checked-keys更新错误，父级别禁用
最近项目中再做一个 选择为树组件的需求，页面内容大概为这样可折叠，可选择，在点击详情回显的时候，根据后台返回的数据（id），来勾选用户选择的信息html代码 <div class="checkboxClass"> <el-tree :check-strictly="true" :data="allWorkList" :default-checked-keys="checkIds" @check='getname' show-chec
2021-08-17 14:45:00
925
原创 问题待解决
<template> <div class="pageContent"> <div id="systemOrganBox"> <!-- 左栏树结构 --> <div class="outsideBox"> <div class="treeClass"> <!-- <el-tree :default-expand-all='true' ref="tree"
2021-08-16 11:20:26
305
原创 element ui 的树形结构，点击节点动态增加子节点并自动展开
<el-tree ref=“tree” @node-click=“handleNodeClick”>异步获取数据，并用append或updateKeyChildren增加子节点updateKeyChildren通过 keys 设置节点子元素，使用此方法必须设置 node-key 属性 (key, data) 接收两个参数，1. 节点 key 2. 节点数据的数组假如你的节点数据没有一个唯一的key(一般是id)，则不能用，但是这个方法第二个参数是数组，比较方便this.$re
2021-08-11 14:59:48
7742
1
原创 element-ui处理多选checklist的数据，根据后台要求处理选中的id并以逗号形式拼接
第一种方式 this.checkList 为选中数据 this.allWorkList 为你页面渲染的数组 let arrName = this.allWorkList.filter(item => { return this.checkList.includes(item.name) }); let arrId = arrName.map(v => { return v.id + ','; }); consol...
2021-08-10 10:11:49
692
原创 element-ui的upload组件使用按钮弹出上传框
这篇总结之后element-ui的踩坑记录场景是： 我点击按钮想弹出上传框，结果选中它的ref元素加click事件压根不生效后来用的是： <el-upload **ref="upload"** class="avatar-uploader" action="https://jsonplaceholder.typicode.com/posts/" :show-file-list="false" :on-success="handleAvatarSuccess" :b
2021-08-03 17:04:20
1298
原创 一些项目中用到的校验规则vue+element-ui
这篇之后就记录一下，项目中用到的校验规则把，方便之后在遇到了，直接拿来用（社会信用代码，身份证号，手机号）目前这么多，之后用了在补！社会信用代码/submit.vue 页面引入import { isvalidPhone, CheckSocialCreditCode } from '@/assets/js/validate.js';应用： 1:手机号let validPhone = (rule, value, callback) => { if (!value) { cal
2021-08-03 11:19:46
696
原创 vue一个页面触发另一个页面的方法
之前很早的时候总结过，不过那一篇是，父组件里面嵌套子组件的情况下，进行传参，从而实现调取页面 的方法。今天总结一下，两个页面不嵌套，兄弟组件的情况下，调用另一个页面的初始化方法1:首先：导入VUE实例，创建一个Bus.js2:在你要用的页面导入，并用$on去传递你用的方法3:哪个页面想要用到，直接用emit去接收（我这里是请求成功后初始化列表）...
2021-08-02 11:04:16
3816
1
原创 element-ui修改tree树结构的展开收起图标
转自:添加链接描述<template> <div> <el-tree :data="data" show-checkbox node-key="id" :props="defaultProps" default-expand-all :expand-on-click-node="false"> <span slot-scope="{ node, data }" class="custom-tree-node"> <
2021-07-26 10:24:01
1029
原创 设置谷歌浏览器，实现跨域获取数据
因为之前用的都是很常见的 解决跨域的办法1:后台设置 header2：前台设置代理但是这次新搭建的项目，说的是google设置跨域后联调，到时候配置里面要改下环境地址去实现跨域。没接触过这种，就上网查了一下， 通过cmd去设置，把我这边的设置方法罗列一下，能帮到有需要的人，之后自己也能方便查看没设置之前为这样：1：首先找到谷歌的属性，文件所在位置复制2：win+r进入 cmd窗口， cd进入你的文件所在路径3：随后后面拼上chorm.exe 如后面的一串 chrome.exe --di
2021-07-21 16:49:39
472
原创 在vscode里面配置eslint自动保存检验
项目中用的eslint，自己手写代码还要去注意空格，报了好多eslint语法错误，你一个个检验又太浪费时间，所以 vscode里面配置一下，写完直接ctrl + s 轻松解决以下试用于windows 10 系统首先路径 ： 文件 -> 首选项 ->设置页面搜索format 找到HTML Format这个属性点开setting.json进行配置我配置的代码如下 ：{ "editor.tabSize": 2, "eslint.autoFixOnSave": true,
2021-07-12 14:21:08
1087
原创 解决vscode的任务栏白色图标的问题
https://blog.csdn.net/lvdou1120101985/article/details/89509977 用的这种方法右键 到vscode的任务栏 去选择code.exe 选择即可
2021-07-09 09:24:31
5717
原创 2021-07-02
这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Markdown编辑器你好！ 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Mar
2021-07-02 11:00:03
49
原创 在搭建环境时提示vue不是内部或外部命令解决方案
我用的是第二种， 太牛b了 直接解决，在高级设置里面配置pathhttps://blog.csdn.net/weixin_41883384/article/details/90414566点赞冲冲冲
2021-07-01 15:19:32
194
原创 element-ui的表格table去掉选中高亮
一开始尝试用 rowClass 只能改变背景色设置为none并没有效果 <el-table show-summary border :data="gridData" ::row-style="rowClass"></el-table> rowClass({ row, rowIndex }) { if (row) { return { "background-color": "#fff" }; } else {
2021-06-04 15:20:50
1975
2
原创 el-select选择值之后试图没有更新的问题
问题就是 在用element-ui的下拉框组件的时候，选择完值死活没有更新上去查了办法一开始用的是给 select加个change事件，对数据强制刷新，this.$forceUpdate(); 没有生效后来仔细看下代码，是因为el-select绑定值的问题。。。。model 要绑定插槽里面的每一项 value值 解决主要前段时间用的是ant-desgin-vue 现在之前碰到的问题忘了，之后会多总结遇到的问题，希望能帮助到初踩坑的你们...
2021-06-03 15:02:46
1178
3
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人