![](https://img-blog.csdnimg.cn/20201014180756757.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue组件
文章平均质量分 50
Amnesia�
一个正在努力中的前端小白
展开
-
vuex使用
vuex使用教程–入门篇什么是vuex?按照官网的说法,Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。vuex的组成vuex由五个部分组成,分别是State,Mutation,Action,Module,Getterstate共享状态Mutation更改vuex的store中state的唯一方法,只有通过提交mutation才能修改状态(变量值)Action类转载 2022-05-24 17:56:38 · 89 阅读 · 0 评论 -
【ElementUI】el-table可编辑/输入框 卡顿性能问题解决案
问题背景用el-table配合el-input直接渲染可编辑行,在数据量大的情况下,会出现输入卡顿的问题。原因分析el-input组件实例数量过多。el-input的v-model在表单输入时频繁触发更新事件。解决思路3. 用原生input替换el-input,以减少el-input组件实例。并在原生input上应用el-input的样式,使前者后者外观一致。在v-model指令上追加.lazy修饰符,使实例数据仅在失去焦点时更新,减少触发次数。此时光标进入输入框,执原创 2022-03-24 15:08:23 · 4763 阅读 · 0 评论 -
element ui中表格输入框回车跳到另一输入框
<template> <div> <el-button @click="add">新增</el-button> <el-button @click="save">保存</el-button> <el-form id="table-form" ref="form" :rules="rules" :model="form"> <el-table ref="table" :data=.原创 2021-06-04 17:41:02 · 1395 阅读 · 0 评论 -
this.$set的用法,even loop机制
vue 中将B对象深拷贝到A对象中,如果A中需要额外新增其他属性 ,则使用this.$set(A,新增的属性名称,属性的值)//深拷贝this.user = JSON.parse(JSON.stringify(data))//新增属性this.$set(this.user,"age", 30)原创 2021-09-03 10:19:42 · 264 阅读 · 0 评论 -
vue导出数据为excel且设置样式
1. 首先安装以下三个安装包npm install --save xlsx(修改样式需要下载npm install --save xlsx-style)npm install -S file-savernpm install -D script-loader在项目中新建一个文件夹(一般在src下新建,文件名自取,在这里命名为excel),在文件夹中放入Blob.js 和 export2Excel.js (这两个文件可在gitup上进行下载)Blob.js ,export2Excel.js下载地原创 2020-09-23 15:19:47 · 3350 阅读 · 3 评论 -
vue中过滤数据小数点前使用千位分隔符 小数点后不使用且保留位数
import Vue from 'vue'//全局过滤器,金额千分位Vue.filter('moneyFormat', function (value) { if (value != undefined) { return value.toFixed(2).toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1,"); }})//全局过滤器,数量2位Vue.filter('qtyFormat', function (value) {原创 2021-07-02 17:32:14 · 879 阅读 · 1 评论 -
Vue中provide和inject 用法
1.概念成对出现:provide和inject是成对出现的 作用:用于父组件向子孙组件传递数据 使用方法:provide在父组件中返回要传给下级的数据,inject在需要使用这个数据的子辈组件或者孙辈等下级组件中注入数据。 使用场景:由于vue有$parent属性可以让子组件访问父组件。但孙组件想要访问祖先组件就比较困难。通过provide/inject可以轻松实现跨级访问父组件的数据2.简单来说 provider/inject:简单的来说就是在父组件中通过provider来提供变量,然原创 2021-02-07 17:16:27 · 865 阅读 · 0 评论 -
手摸手教你撸一个可拖拽组件(附源码)
业务需求1、 实现一个可以全页面可以拖拽的组件2、顺带介绍一下vue-draggable插件,可以实现多个组件之间的拖动展示一下效果图一、可拖拽组件的封装这个组件我是借用的vue的directive自定义指令的方式实现的,如果对vue的自定义指令还是不很熟悉的话可以先去官网了解一波,当然熟悉的童鞋也可以不用vue自定义指令来实现export default{ bind(el, binding, vnode) { const dialogHeaderEl = el.querySele转载 2021-01-05 09:19:18 · 384 阅读 · 0 评论