- 博客(23)
- 收藏
- 关注
RSS订阅原创 element 数组循环校验及自定义校验
重点需要填写的注意 element校验模块 必须是object 所以把 把list放到ruleForm里面<!-- * @Author: your name * @Date: 2022-03-02 14:45:12 * @LastEditTime: 2022-03-03 09:36:26 * @LastEditors: Please set LastEditors * @Description: 打开koroFileHeader查看配置 进行设置: https://github.co
2022-03-03 10:26:44
995
原创 vue文件流导出封装 兼容ie
问了不影响原先的axios封装 及拦截 重新定义了一套新的专用于文件流的导出方法 并兼容ie10以上excelFileDown.js/* * @Author: your name * @Date: 2021-11-24 15:58:37 * @LastEditTime: 2022-02-08 18:50:57 * @LastEditors: Please set LastEditors * @Description: 打开koroFileHeader查看配置 进行设置: https://gi
2022-02-09 10:22:41
599
原创 scss 混合指令@mixin的定义
指令的用法是在 @mixin 后添加名称与样式例如：定义flex 布局/*默认一个样式*/@mixin flex($hov:space-between,$col:center){ display:flex; justify-content:$hov; align-items:$col;}文件中调用：.ads-box{ @include flex();}/*或者更改默认样式*/.ads-box{ @include flex('center','left')}@mixi
2021-09-02 10:34:13
596
原创 vue的双向绑定原理
Vue2x: vue.js 则是采用数据劫持结合发布者-订阅者模式的方式，通过Object.defineProperty()来劫持各个属性的setter，getter，在数据变动时发布消息给订阅者，触发相应的监听回调。Vue3.0: 是数据劫持的方式由Object.defineProperty更改为Proxy 代理是采用数据劫持结合发布者-订阅者模式的方式，通过new Proxy()来劫持各个属性的setter，getter，在数据变动时发布消息给订阅者，触发相应的监听回调。...
2021-06-21 09:42:46
89
原创 elementPlus 日期组件数据返回格式 dayjs
elementplus 删除了数据返回的日期格式 ，不过官方推荐了dayjs 方法 来解决日期格式dayJS 网址：https://dayjs.gitee.io/zh-CN/npm dayjs : https://www.npmjs.com/package/dayjs引入方式使用dayjs('2018-08-08') // parsedayjs().format('{YYYY} MM-DDTHH:mm:ss SSS [Z] A') // displaydayjs().set('mont
2021-06-18 16:45:54
1724
原创 Element plus NavMenu 导航菜单使用
<el-menu :default-active="active" class="sidebar-menu" background-color="#f9f9f9" text-color="#565656" unique-opened router active-text-color="#0079fe" :collapse="isCollapse" @select="handleSelect"> <templat
2021-06-10 14:51:09
4514
原创 js浅拷贝和深拷贝的区别
如何区分浅拷贝和深拷贝。浅拷贝：拷贝栈内存中的引用地址(堆内存地址)，两个对象堆内存指向同一个地址如图：深拷贝：拷贝对象在栈内存中新建了一个堆内存，对象分别对应一个地址如图：实现深拷贝方法递归递归去复制所有层级属性function deepClone(obj){ let objClone = Array.isArray(obj)?[]:{}; if(obj && typeof obj==="object"){ for(key in obj
2021-05-28 10:01:31
120
原创 vue3.x mitt使用方法
在vue3.x中 删除了$on $emit等方法 不过官方推荐第三方库 mitt使用方法:ValidateForm.vue<template> <form class="validata-input-container" > <slot></slot> <div class="submit-area" > <slot name="submit">
2021-05-28 09:32:06
3191
原创 vue 路由:id 可有可无
只需要在router路由后面加一个?就可以了{ path: '/CreatPost/:id?', name: 'CreatPost', component: () => import('./views/CreatPost.vue')}
2021-05-14 10:21:01
472
原创 vue3.0 reactive函数
reactive函数 在vue3.0中是 返回响应式对象的函数用法<h3>{{conte}}</h3>setup(){ const data = reactive({conte: 10}) return { data }}
2021-05-13 14:28:36
436
原创 vue3.0路由 vue-router4.0使用方法
vue-router 官网https://next.router.vuejs.org/zh/installation.html安装最新版vue-router4.0npm install vue-router@4router.ts 路由配置表import { createRouter, createWebHistory } from 'vue-router'const routerHistory = createWebHistory()const router = createRouter({
2021-05-13 11:56:38
3102
1
原创 vue-quill-editor 自动获取焦点问题
vue-quill-editor 在获取到接口传过来的内容之后会获取焦点，所以 思路就是调用接口之前先禁止获取焦点，获取到内容之后再开启。放到mounted中this.$refs.myQuillEditor.quill.enable(false);接口调用之后 并获取到内容之后调用this.$nextTick(()=>{ this.$refs.myQuillEditor.quill.enable(true);})...
2021-05-07 15:32:24
2249
原创 vue3异步组件Suspense使用方法
App.vue<template> <div id='app'> <Suspense> <template #default> <dog-show /> </template> <template #fallback> loading.... </template> </Suspense>
2021-05-07 14:43:40
778
原创 Vue3和Vue2.6x的生命周期对比
Vue2.6 ---------------------- vue3 beforeCreate -> setup() created -> setup() beforeMount -> onBeforeMount mounted -> onMounted beforeUpdate -> onBeforeUpdate updated -> onUpdated beforeDestroy -&
2021-05-06 17:21:12
243
原创 vue 使用BaiduMap
在vue 中使用Baidu Map 需要引入 vue-baidu-map包该项目是使用地图标注获取经纬度npm install vue-baidu-maphtml:<baidu-map class="bm-view" :zoom="zoom" :center="center" inertial-dragging :ak="selfKey" @zoomend="getZoomend" :scroll-wheel-zoom="
2021-05-06 16:45:59
580
原创 vue 压缩gzip文件
压缩gzip vue.config.js 文件 module.exports中configureWebpack: config => { if (process.env.NODE_ENV === 'production') { config.plugins.push(new TerserPlugin()) config.plugins.push(new CompressionWebpackPlugin({ algorithm: 'gzip',
2021-05-06 16:33:16
156
原创 自制npm包上传到npm平台
在项目中有很多需要修改的npm包源码， 我们可以把修改后的的源码打包上传到npm平台上方便使用。 重要： 包名称和版本号必填 且不能和平台上已有的包名重复然后终端进行npm 登录，(如果你以前使用过npm淘宝镜像的下载链接，这个时候要将下载链接设置回来)然后 npm login ，输入你注册npm的时候的用户名、密码和邮箱。npm login登录成功后 输入命令 npm publish 进行上传到npm 平台 npm publish如果报错 请查看包名和版本号 。npm包 平.
2021-05-06 16:26:35
171
原创 web移动端安卓和ios兼容问题
1、click300ms延迟fastclick可以解决在手机上点击事件的300ms延迟触摸事件的响应顺序为 touchstart --> touchmove --> touchend -->click,也可以通过绑定ontouchstart事件，加快对事件的响应，解决300ms延迟问题若移动设备兼容性正常的话（IE/Firefox/Safari(IOS 9.3)及以上），只需加上一个meta标签把viewport设置成设备的实际像素，那么就不会有这300ms的延迟。
2021-03-17 10:10:30
1447
原创 vue打包/上线部署及性能优化
1、v-for和v-if不要在同一级使用,v-for比v-if的优先级高 会先执行循环，同时使用了会每次循环都执行一次v-if，2、vue 中使用的js资源 尽量的使用cdn方式在加载，以此减少打包之后的体积例：externals: { jquery: 'jQuery'}//[webpack外部扩展功能](https://www.webpackjs.com/configuration/externals/)3、路由器的按需加载//ES6方式加载{ path:'/denglu',
2020-12-14 16:49:45
295
原创 vue2.6x 使用echarts图表
后台管理系统必不可少的图表统计earchs,引入很简单官网中写了webpack引入earchs下载：当然 vue2.5引入的方式跟webpack有些区别的直接用import引入 ，注意：引入不要公共引入 不然包太大，影响加载速度，不然上线之前 性能优化也会需要再次处理。import echarts from 'echarts'例：<template> <div class="chinaMap"> <div id="map" ref="MapMountNode
2020-12-14 16:48:51
1119
2
原创 vue路由传参及组件传参和组件方法调用
VUE路由和组件传参第一种vue自带的路由传参的三种基本方式1.通过name :id传参子组件通过$route.name接收参数{ path: '/particulars/:id', name: 'particulars', component: particulars}this.$router.push({ path: `/particulars/${id}`,})通过p>{{KaTeX parse error: Expected 'EOF',
2020-10-30 10:31:16
798
原创 微信小程序日历签到
近期做了一个项目需要用到日历插件，在网上找了一部分感觉跟项目不对口，所以就查考了其他的日历插件做了一个。需求：如图：代码如下：index.wxml:<!--pages/pictruesign/pictrue.wxml--><view class='gs_banner'> <image src='../../image/banner.jpg'></image> <view class='gs_continue'>
2020-10-30 10:28:54
1297
6
原创 elementui NavMenu导航菜单默认展开
近期项目用vue+element ui 做了一个新的后台管理系统 用到了菜单模块， 功能需要他刷新返回自动展开原本的导航列表，经过网上搜索发现 现有网上的博客都不能实现（可能是我自己的原因）,经过摸索发现，默认展开导航需要两个关键属性default-openeds和default-active，官网上解释的 当前激活菜单的 index 和 当前打开的 sub-menu 的 index 的数组，多的不哔哔了 上代码看就懂了:default-openeds="defalut"中的defalut指的是['1
2020-10-30 10:24:05
6625
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人