- 博客(26)
- 资源 (1)
- 收藏
- 关注
原创 vue3.x使用Element plus的级联选择器el-Cascader
在级联选择器@change方法中,监听变化,首先添加一个ref=“cascaderHandle”,在@change绑定的方法中监听: proxy.$refs.myCascader.dropDownVisible = false;Element plus 好像取消了 改为 可以实现
2022-06-14 10:12:47 1099 3
原创 element-ui form 表单按回车后整个页面刷新
element-ui form 表单按回车后整个页面刷新<el-form :model="form" ref="ruleFormRef" size="default" label-width="70px"> <el-row :gutter="20"> <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20"> <el-form-item label=
2022-05-13 13:45:12 955
原创 使用CDN引入element-ui时改变全局配置(size,zIndex)
// import ElementUI from "element-ui";// import "element-ui/lib/theme-chalk/index.css"// Vue.use(ElementUI, { size: 'small', zIndex: 3000 })Vue.prototype.$ELEMENT = { size: 'small', zIndex: 3000}
2022-02-17 16:36:03 1122
原创 Ant Design React中 Form.Item 中设置Select,Input.TextArea,Input默认值
Ant Design React中 Form.Item 中设置Select,Input.TextArea,Input默认值
2021-12-30 10:51:08 2042
原创 React使用wangEditor编辑器添加数学公式的编辑功能
**项目框架是React是教育类app的后台管理 属于接前同事的项目 现在客户要求编辑器可以编辑数学公式之前是直接截图上传公式图片 其实都不理想**这样就开始查资料启发于这篇文章 直接编辑和手写因为里面的资源都是打不开了,只能自己找一.基于javascript和css开发的 Web富文本编辑器, 轻量、简洁、易用、开源免费使用原因 wangeditor的文档 (地址:http://www.wangeditor.com/)1.轻量:相对于百度富文本,体积真心小,2.简洁:我的理解,功能
2021-12-28 15:43:16 3664 13
原创 react怎么关闭eslint 或避免出现检测 整理
1.根目录下创建.eslintrc.json文件实现方法:在根目录下创建.eslintrc.json文件,然后设置自己的eslint配置{ "extends": ["react-app"], "rules": { "eqeqeq": "off" }}2.在 package.json 中修改为一下"eslintConfig": { "extends": "react-app", "rules": { "no-undef": "o
2021-11-17 15:06:00 5928
原创 es6 极其简单的数据处理方法
es6 最新数据去重 Array.from数组去重:set有去重功能,返回类数组,通过 延展符/Array.from 转成数组let arr = [1,1,1,1,2,2,2,3,3,3,5,6,7,1,1,1,1,2,2,2,3,3,3,5,6,7];[…new Set(arr)]; // [1, 2, 3, 5, 6, 7]Array.from(new Set(arr)); // [1, 2, 3, 5, 6, 7]new Set(),用来去重数组。Set类似于数组,区别在于它所有的成员都是
2021-09-27 10:13:09 227
原创 element-UI中的el-image加载图片自定义加载动画
前面都有 在这个里面 简书 连接地址自行观看拿到 在加载前和加载中是一个类名为el-image__placeholder的div标签,在加载后和加载出错后分别是一个div和img标签.el-image__placeholder 是加载出图片前 显示的 可以加一个 loading 的图片 这里有loading地址 也可以用 c3 自己写一个<style>/* 加载前 */.el-image__placeholder { background: url('./loadingI
2020-09-29 10:44:07 7788 1
原创 【ElementUI】Cascader 级联选择器点击选完收起
我们希望选择后收起下拉 官方是没有这个只需要监听里面的 v-model=“id” 的值 <el-cascader :options="options" v-model="areaId" ref="refSelect"//记得!!! :show-all-levels="false" change-on-select @change="handl
2020-08-10 14:30:12 2162
原创 【webapp】微信公众号点击唤起qq,微博,公众号首页超简单
在开发中遇到h5嵌套的到微信公众号中的联系我们,web上使用的是点击放大二维码手机扫码关注,但是在手机上交互效果就不是很好百度了很多但是都不可用 也不知道为什么就突然一个想法 二维码 我可不可以把分享的二维码 通过解码器获取到分享链接直接跳转那 说干就干 找到qq的二维码 解码可以百度也可以用这个 二维码解码器拿到解码后的地址 openQQ(qq) { window.open( 'https://qm.qq.com/cgi-bin/qm/qr?k=VEMK1kRTYX
2020-07-07 16:36:25 2221
原创 【ElementUI】DatePicker 日期选择器 设置日期,只能选择今天和未来时间
最近的 工作当中遇到一个问题,就是使用Element日期控件 DatePicker 日期选择器的时候,因为我是用于预约功能 产品说:过去的时间还能选,是想让他穿越嘛…(能穿越多好!起)哈哈哈哈本来是这样的在DatePicker 日期选择器组件上设置:picker-options=“pickerOptions” <el-row :gutter="1"> <el-col :span="13"> <el-date-pi
2020-07-06 16:06:48 3791
原创 element form如何在 label 前面添加必填 红星 ※而不加验证
<el-form-item label="图文详情:" :required="true"> <Ueditor ref="changeUeditor" :value="datahtml"></Ueditor> </el-form-item>添加 :required=“true”
2020-06-29 14:31:35 8860 3
转载 ZOOM:1的原理和作用
zoom:1确实帮我们解决了不少ie下的bug,但是它的来龙去脉,又有多少人知道呢?所以我老生常谈,说一下它的来龙去脉。Zoom属性是IE浏览器的专有属性, 它可以设置或检索对象的缩放比例。在平常的css编写过程中,zoom:1能够比较神奇地解决ie下比较奇葩的bug。譬如外边距(margin)的重叠,譬如浮动的清除,譬如触发ie的 haslayout属性等等。度娘告诉我们:zoom是 设置或检索对象的缩放比例。设置或更改一个已被呈递的对象的此属性值将导致环绕对象的内容重新流动。(没看懂)虽然此
2020-06-22 10:07:34 421
原创 el-table表头与内容右边框错位问题
在用element写一个后台管理系统时遇到一个坑,el-table标签渲染出数据后表头th和内容会有错位,之前没有的 修改大小都没用 于是看百度搜索一波最终解决修改之前 虽然不大 但是别扭在全局添加 css属性 完美解决 有效body .el-table th.gutter { display: table-cell!important;}添加之后看着舒服多了 具体原因有待研究...
2020-06-18 14:39:33 1213 1
原创 ElementUI的el-tree控件用后台数据结构的生成及选择数据的回显
ElementUI tree分析业务需求后台管理里面的权限设置 需要用到树形结构 我用了ElementUI的el-tree控件数据 1.拿到所有的父节点显示在tree中<template> <el-tree :data="rootData"//数据 default-expand-all show-checkbox node-key="id"
2020-06-18 10:59:47 7520
原创 vue cli3项目中使用qrcodejs2生成二维码
组件的形式创建1.下载依赖npm install qrcodejs22.创建一个.vue的组件放置代码(我创建的是qrcodejs2.vue)//template中的代码<template> <div class="boxshow"> <div class="qrcode" ref="qrcodeContainer"></div> </div></template><script>impor
2020-06-16 10:39:41 1417
原创 前端纯js处理图片URL转Base64,Base64转二进制文件流
前端纯js处理图片URL转Base64,Base64转二进制文件流图片地址新的改变功能快捷键合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML 图表FLowchart流程图导出与导...
2019-11-28 17:51:08 5164
转载 Webpack
Webpack一、市面上有哪些类似于Webpack的前端工程化工具【 自动化工具 】gruntgulp ( 4.x )Browserify ( Webpack 前身 )Webpack 【 主流行 】rollup.js https://www.rollupjs.com/guide/zh 【 小众 】parcel 【 小众 】FIS https://fis.baidu.com/...
2019-08-03 14:57:37 81
转载 读懂diff
diff是Unix系统的一个很重要的工具程序。它用来比较两个文本文件的差异,是代码版本管理的基石之一。你在命令行下,输入:$ diff <变动前的文件> <变动后的文件>diff就会告诉你,这两个文件有何差异。它的显示结果不太好懂,下面我就来说明,如何读懂diff。一、diff的三种格式由于历史原因,diff有三种格式: * 正常格式(normal...
2019-08-02 20:30:32 141
转载 深入Vue2.x的虚拟DOM diff原理
一、前言Vue的核心是双向绑定和虚拟DOM(下文我们简称为vdom),关于双向绑定可以参阅木琴的文章《剖析Vue原理&实现双向绑定MVVM》,vdom是树状结构,其节点为vnode,vnode和浏览器DOM中的Node一一对应,通过vnode的elm属性可以访问到对应的Node。vdom因为是纯粹的JS对象,所以操作它会很高效,但是vdom的变更最终会转换成DOM操作,为了实现高效的D...
2019-07-29 17:23:51 78
转载 npm 可以在项目package.json里面自定义脚本命令
npm 可以在项目package.json里面自定义脚本命令package.json文件{ "script":{ "dev": "webpack -w" }}package.json文件中的字段script的每一个属性都是一个自定义的脚本命令。在命令行中可以通过执行npm run dev来执行这段脚本。执行原理使用npm run script执行脚本的时候都会创建...
2019-07-18 21:28:37 5887
转载 Promise 的含义
Promise 的含义Promise 是异步编程的一种解决方案,比传统的解决方案–回调函数和事件--更合理和更强大。它由社区最早提出和实现,ES6将其写进了语言标准,统一了语法,原生提供了Promise所谓Promise ,简单说就是一个容器,里面保存着某个未来才回结束的事件(通常是一个异步操作)的结果。从语法上说,Promise是一个对象,从它可以获取异步操作的消息。Promise 对象的...
2019-07-17 19:17:03 278
原创 自定义包上传npmjs
注意: 记住要发送邮箱激活注意: 切换你的npm源 nrm在国内我们可能使用的是国内的淘宝源,切记用 nrm use npm 切换注意: 你的包的名称不要和别人的重复(文件名字)步骤:登录npm账号npm adduser上传npm publish详细步骤:创建需要上传的包名称(可以在上传之前打开npm官方搜索一下是否存在重名)终端中输入命令(npm in...
2019-07-17 19:06:47 124
原创 node.js的自定义模块的创建和使用
自定义模块创建模块 const name = { id:1, name:" haoqi " } const obj = '内容'2.导出模块2.1module.exports = name2.2 推荐(可导出多个)module.exports = {//批量导出 name, obj }自定义...
2019-07-16 18:48:23 304
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人