vue.js
芝麻油yy
这个作者很懒,什么都没留下…
展开
-
ElementUI实现按需加载组件
ElementUI实现按需加载组件原创 2022-08-22 21:40:01 · 1587 阅读 · 0 评论 -
ERROR Invalid options in vue.config.js: “baseUrl“ is not allowed
我的vue版本@vue/cli 4.5.15在vue-cli.3.3版本后 baseUrl被废除了,因此这边要写成 publicPath。原创 2021-12-31 14:11:42 · 746 阅读 · 0 评论 -
ElementUI如何将当前组件的所有属性快速传递给子组件
1.普通写法,对应的是一个一个元素的绑定<el-table border style="width='300px'" :data='tableData'> <el-table-column v-for="col in columns" :prop="col.prop" :key="col.prop" :label="col.label" :width="col.width">原创 2021-12-28 11:54:24 · 829 阅读 · 0 评论 -
ElementUI在el-table基础上进行导出.xls表格操作
1.截图2.导出按钮<el-button type="warning" icon="el-icon-download" size="mini" @click="handleExport">导出</el-button>3.导出方法this.downloadFile为全局挂载的方法/** 导出按钮操作 */ handleExport() { // 导出接口 exportHealthSubsidy(this.ids) .原创 2021-12-27 20:23:23 · 609 阅读 · 0 评论 -
ElementUI分页组件的封装
1.准备封装创建index.vue路径:src-->components-->Pagination-->index.vue<template> <div :class="{'hidden':hidden}" class="pagination-container"> <el-pagination :background="background" :current-page.sync="currentPage"原创 2021-12-27 19:25:31 · 216 阅读 · 0 评论 -
ElementUI中实现表单刷新重置,保存在全局方法中
elementUI中的resetFields方法1.在el-form添加属性在el-form中定义ref属性queryForm<el-form ref="queryForm" :model="queryParams" :inline="true" label-width="68px">2.刷新重置方法刷新按钮:<el-button icon="el-icon-refresh" size="mini" @click="handleRefresh">刷新.原创 2021-12-27 10:48:11 · 2695 阅读 · 0 评论 -
el-table中的:label使用变量换行
1.效果2.实现代码 <el-table-column prop="cprateDeposit" :label="'对公存款\n(万元)'" align="center"> </el-table-column>3.解析使用:label,并且使用\n换行;其中align 是使文字居中原创 2021-10-25 09:11:59 · 304 阅读 · 0 评论 -
vue项目使用npm run dev 编译到一半不动了
发现是因为自己在写setTimeout定时器时,其自动导入了import { setTimeout } from 'timers'; 导致编译卡住,删除后编译正常。如果你不是这个错误,可能是代码其他位置有比较明显的报错导致的,可以检查一下代码的报错。...原创 2021-10-21 19:03:47 · 1820 阅读 · 0 评论 -
echarts格式化tooltip数据
1.效果将数据每隔三个数字用逗号分隔2.实现代码tooltip: { trigger: "axis", backgroundColor: "rgba(50,50,50,0.7)", // 提示框浮层的背景颜色。 textStyle: { // 提示框浮层的文本样式。 color: "#fff", fontStyle: "normal", ..原创 2021-10-21 09:04:37 · 1266 阅读 · 0 评论 -
Vue修改默认字体
1.在assets文件夹下创建文件夹,命名为font2.在font文件夹中新建文件:font.css@font-face { font-family: "pingFangSC-Medium"; src: url("./PingFangMedium_0.ttf"); font-weight: normal; font-style: normal;}3.下载字体包4.App.vue文件中使用<style rel="stylesheet/...原创 2021-10-18 16:09:20 · 2781 阅读 · 0 评论 -
vue获取当前日期和时间并进行格式化
1.样式:2.思路:这里我用的是用elementui框架搭的结构,其中图标icon采用的是插槽。prefix:指的是插在前面suffix:指的是插在后面 <span class="currentDate"> <span slot="prefix" class="el-icon-timer"></span> {{dateFormat(date)}} </span>css样式:原创 2021-09-30 11:17:14 · 12559 阅读 · 0 评论 -
echarts实现给图例添加单位、百分比,以及图例文字过长显示省略号
修改lengendformatter: (name) => { if (this.seriesData.length) { let sum = 0; this.seriesData.forEach((item) =>{ sum += parseFloat(item.value) }) const item = this.seriesData.filter((item) => it原创 2021-09-29 14:56:24 · 1309 阅读 · 2 评论 -
ElementUI中分页Pagination 样式的修改(分页组件的封装)
1.实现效果:2.实现代码:<template> <div :class="{'hidden':hidden}" class="pagination-container"> <el-pagination :background="background" :current-page.sync="currentPage" :page-size.sync="pageSize" :layout="layout"原创 2021-09-17 17:42:48 · 1558 阅读 · 0 评论 -
在ElementUI中改变el-table中的el-table-column样式
1.效果一览2.实现思想:使用作用域插槽:slot-scope="scope";绑定class类'back';v-if条件判断:如果scope.row.xh == 1,2,3 ,则给他绑定类,设置样式。不满足条件的则不绑定类,不设置样式。3.实现代码:html代码:<el-table-column prop="xh" label="序号" width="80" align="center"> <template slot-scope="...原创 2021-09-17 16:25:40 · 1836 阅读 · 0 评论 -
Echarts实现环形图的渐变颜色效果
已经封装好的环形图组件直接在要用的vue文件中引用: <circleChart :id="chart4.id" :width="chart4.width" :height="chart4.height" :bgColor="chart4.bgColor" :circleData="chart4.cir...原创 2021-09-13 17:58:42 · 4135 阅读 · 0 评论 -
ElementUI改变el-table的表头颜色以及各行的颜色
1.实现效果2.实现代码<el-table :data="tableData" :header-cell-style="{ background: '#E5E9F4' }" :cell-style="{ color: '#5e708e' }">其中:header-cell-style="{ background: '#E5E9F4' }".原创 2021-09-09 18:05:30 · 2046 阅读 · 0 评论 -
点击input框,添加阴影效果
1.普通的input框设置: input:focus{} <input type="text"></input>style样式:input:focus{ //设置阴影效果 box-shadow: 0px 0px 12px 0px rgba(98, 19, 254, 0.6); //设置border效果 border: 2px solid #5813fe;}2.Elementui中的输入框设置: .el-in...原创 2021-09-01 14:02:35 · 3144 阅读 · 0 评论