![](https://img-blog.csdnimg.cn/20201014180756930.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Vue2
文章平均质量分 59
vue2实战及技术分享
sout-lanys
扣扣:1090613735
展开
-
vue2 Excel 导出数据量太大导致OOM问题及解决方案
当点击导出Excel,会根据查询条件导出数据,比如,查询时间,会随着时间间隔的增大,数据量也会变多,已导出就是全部,若数据量相对较少,会导致卡顿或者请求超时,若数据量非常多,会导致请求超时或服务器宕机(卡死)。总的来说是可以解决了问题,但是感觉方案不是很好,若大佬们有更好的解决方案,欢迎在评论区提出。原创 2023-03-07 13:34:55 · 2023 阅读 · 1 评论 -
vue 使用Blob、Export2Excel实现导出excel(简单快捷)
vue 实现Blob、Export2Excel导出excel(简单快捷)原创 2023-03-07 12:11:08 · 1476 阅读 · 0 评论 -
Vue2 cube-ui时间选择器
前言vue2 整合 cube-ui 时间选择器(供有点点基础的看)一、需求及效果需求我们要在原搜索的情况下,加搜索时间效果二、代码实现index.vue(html)<div class="header"> <cube-input v-on:focus="showMinPicker('startTime')" v-model="startTime" placeholder="开始时间" :maxlength=30 style="width: 50%;">原创 2021-12-16 14:28:52 · 6280 阅读 · 0 评论 -
Vue2 cube-ui 实现搜索过滤、高亮功能
前言蛮久没更新 cube-ui 的功能实现了,公司要为售后部门做一个方便查看公司产品的一个项目,遇这需求,虽然常见但自己没做过,在此做个例子当做记录。一、需求流程:实现效果:功能实现html<template> <div class = "device-list-main"> <div class ="header"> <div class="header_title"> <cube-select原创 2022-03-23 17:54:29 · 7632 阅读 · 2 评论 -
Vue实现底部导航栏切换页面及图片
前言刚进新公司,有幸接触到从前后端不分离到前后端分离的一个过程,最开始对vue不太熟悉,下班自学一周就开始做了,可能会有很多问题,若有写不好的地方大佬们可以提出。一、实现效果需求:vue底部导航点击切换图标效果:二、大概思路图三、代码实现index.js(vuex)import Vue from 'vue'import Vuex from 'vuex'Vue.use(Vuex)const store = new Vuex.Store({ state: { // 目原创 2021-12-13 14:14:18 · 9769 阅读 · 2 评论 -
vue 获取后端json返回嵌套对象渲染问题
项目场景:在前端项目中会遇到后端返回一个对象中存在多个实体的对象,若我们直接渲染(直接渲染第三级),例如:html:<span>设备IMEI:{{items.deviceVO.imei}}</span><br>data:data () { items: ''}虽然不影响渲染,但vue在浏览器会抛出警告。问题描述及原因分析:问题:Error in render: “TypeError: Cannot read properties of und原创 2022-01-04 19:09:07 · 6352 阅读 · 0 评论 -
Vue 父子组件的通信及传值
前言父子组件间的通信,组件可以说是一个具有独立功能的整体,但是当我们要将这些组件拼接在一起时,这些组件相互之间要建立联系,这个联系我们就称之为通信一、简单案例html<body> <div id="app"> <Scholar></Scholar> </div> <!-- 初学者模板 --> <template id="scholar"> <di原创 2021-12-18 11:50:25 · 4613 阅读 · 0 评论 -
vue elementui 搜索栏子组件封装
描述: 在基本项目中搜索栏、分页组件格式样式几乎是固定的,只是对应的数据不同,由于模块会随着需求的不断增加,可能会导致重复代码越来越多,这时可以用到子组件,需要将相同的模块代码统一封装,提高开发效率和页面统一。(自己的想法,只根据自己需求来说)jscss父组件部分主要代码(index.vue)html(主要代码)Search 指components注册的标签。:objSearch 指向子组件传的参数@refresh、@exportExcel、@search 指子组件触发的方法js(主要代原创 2022-06-29 12:08:45 · 6113 阅读 · 0 评论 -
element ui搜索栏响应式布局
需求(主要根据自己需求):在做系统模块中,需要搜索的功能比较多,比如时间、name、导出、导入等等、搜索栏不能在同一行(根据领导需要)(记录问题,不喜勿喷)问题描述:不是说屏幕小很正常,但是屏幕小一点点后面那部分就想下移,体验很不舒服解决方案:element ui 提供了 Layout 布局:https://element.eleme.cn/#/zh-CN/component/layout方案一(基础布局)<template> <div class="search-m原创 2022-03-02 11:51:04 · 6577 阅读 · 1 评论 -
vue 使用MD5加密
MD5是一种信息摘要算法(对称加密),一种被广泛使用的密码散列函数,可以产生出一个128位(16字节)的散列值,用来确保信息传输完整一致性。它可以计算任意长度的输入字符串,得到固定长度的输出,而且这个算法是不可逆的,即使得到了加密的密文,也不可能用解密算法反算出明文。全局定义:全局使用:局部定义:局部使用:案例因为MD5加密常用在密码加密中,就暂时不需要全局定义,两种方式都列出。......原创 2022-06-23 14:02:26 · 27457 阅读 · 2 评论 -
vue2 vant-ui 实现搜索过滤、高亮功能
vant 实现是通过输入框(van-field)事件触发弹出层(van-popup),弹出层(van-popup)中包括了选择器(van-picker)原创 2022-11-02 10:18:29 · 4508 阅读 · 0 评论 -
Vue-Class 与 Style 绑定
前言操作元素的 class 列表和内联样式是数据绑定的一个常见需求。因为它们都是 attribute,所以我们可以用 v-bind 处理它们:只需要通过表达式计算出字符串结果即可。不过,字符串拼接麻烦且易错。因此,在将 v-bind 用于 class 和 style 时,Vue.js 做了专门的增强。表达式结果的类型除了字符串之外,还可以是对象或数组。官网地址:https://cn.vuejs.org/v2/guide/class-and-style.html一、 Class官方语法及案例(html原创 2021-12-14 10:28:08 · 5189 阅读 · 0 评论 -
vue回车事件
vue回车事件原创 2022-06-14 15:09:18 · 15444 阅读 · 0 评论 -
element下拉框获取选中的内容
前言好久没更新了,开发遇到新的东西,记录一下,公司自研的项目PC端迭代到前后端分离了,巧了遇到新的UI框架 element-ui,虽然不熟,还是被硬着头皮上。一、需求及实现效果需求:在下拉框中选择一条数据,获取他的id及name数据(多参数)。实现效果:二、实现html@change="selectDoctor(doctorId)" <!-- 参数可以不写,会自带的 --> <el-form-item label="医生"> <原创 2022-01-14 18:45:29 · 9418 阅读 · 3 评论 -
vue cube-ui 搜索栏子组件封装
vue2 整合 cube-ui 子组件(供有点点基础的看)jscss父组件部分主要代码(index.vue)html(主要代码)Search 指components注册的标签。:objSearch 指向子组件传的参数@search 指子组件触发的方法原创 2022-07-01 10:05:04 · 4803 阅读 · 1 评论 -
vue2 cube-ui 实现自定义面包屑功能
前言是这样的,公司前端项目是用cube-ui的,有些功能cube-ui并没有,比如面包屑,这是需要自己定义一个,在此做个记录。一、实现效果二、功能实现子组件html<template> <div class="bread-crumbs"> <span v-for="(index,i) in current" :key="index"> <span v-if="current.length < 2" class原创 2022-04-11 15:26:07 · 5500 阅读 · 1 评论