
vue
长箭已搭弓
冲冲冲
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
vue封装通用弹窗commonDialog
【代码】vue封装通用弹窗commonDialog。原创 2022-11-25 09:14:37 · 421 阅读 · 1 评论 -
隔行变色的echarts图
var xdata = ['2020-1-2', '2020-1-2', '2020-1-2', '2020-1-2', '2020-1-2', '2020-1-2', '2020-1-2'] var data = [70, 60, 80, 70, 60, 80, 50] option = { tooltip: { trigger: "axis", axisPointer: { // 坐标轴指示...原创 2021-12-13 09:55:24 · 843 阅读 · 0 评论 -
堆叠双柱状图
堆叠柱状图代码附图原创 2021-12-13 10:00:53 · 295 阅读 · 0 评论 -
echarts图表动态显示数据
<script> var xData = (function () { var data = ['ZBFX', '治安重点', '人口重点', '刑释解教', '信访人员'] return data })() var ydata1 = [], ydata2 = [], ydata3 = [] var zdrykl = echarts.i原创 2021-10-27 09:57:02 · 693 阅读 · 0 评论 -
仪表盘echarts图(附图与代码)
var datas = { value: 82, title: "任务完成占比", type: 1, radiusType: 1};let startAngle=180,endAngle=0;var fontColor = "#00f6f7";var seriesName = "";let noramlSize = 16;let state = "";let center = ["50%", "55%"];let wqradius = 0, nqra原创 2021-10-12 08:40:06 · 1550 阅读 · 1 评论 -
vue中的echarts对象绑定click事件无法调用vue的实例对象
点击事件获取不到refName?方案一:function改为箭头函数方案二:var that = this;this代表的是当前对象,var that=this就是将当前的this对象复制一份到that变量中。当this对象改变的时候,that指向的还是当时的对象。echarts事件与行为...原创 2022-07-04 10:39:17 · 1061 阅读 · 0 评论 -
vue Elementui Timeline 时间线(右)
<el-timeline :reverse="reverse"> <el-timeline-item v-for="(item, index) in warnList" :key="index"> <div class="photo"></div> <div class="timestamp"> <span class="message-label">时间:原创 2022-06-30 11:30:51 · 1216 阅读 · 0 评论 -
timeline(左右结构)
<el-timeline> <el-timeline-item v-for="(item, i) in timeLineFilterData" :key="i" :timestamp="item.createdTime" placement="top">原创 2022-06-30 11:28:29 · 1781 阅读 · 0 评论 -
vue Swiper(附例子)
安装依赖npm install swiper@6 --save-devnpm i vue-awesome-swiper@3.1.3 -Spackage.json查看确认main.js全局引入//swiperimport VueAwesomeSwiper from 'vue-awesome-swiper'import 'swiper/swiper-bundle.css'Vue.use(VueAwesomeSwiper)页面运用点击左右按钮切换<div class="ce原创 2022-03-04 11:22:38 · 682 阅读 · 0 评论 -
大屏左右下载入的动画
@keyframes leftAnimation { 0% { transform: translate(-100%, 0); opacity: 0; } 100% { transform: translate(0, 0); opacity: 1; }}@keyframes rightAnimation { 0% { transform: translate(100%, 0);原创 2022-02-28 15:12:28 · 128 阅读 · 0 评论 -
大屏右上角的年月日时分秒
methods:{currentTime() { setInterval(this.formatDate, 500) }, formatDate() { const date = new Date() const year = date.getFullYear() // 年 const month = date.getMonth() + 1 // 月 const day = date.getDate() // 日 c原创 2021-11-25 10:36:30 · 811 阅读 · 0 评论 -
vue中使用lang = “scss“报错
①npm install sass-loader@7.3.1 --save-dev②npm install node-sass --save安装node-sass报错安装不了,使用淘宝镜像安装cnpm install node-sass --save③npm install style-loader --save④在build/webpack.base.config.js中添加:{ test: /\.scss$/, loaders: ['style', 'css',原创 2021-12-15 10:28:13 · 1025 阅读 · 1 评论 -
elementui(el-date-picker)日期选择器的日历样式修改
/日历样式----------------------------------------------------------/.selfDate {background-color: #08294c !important;color: #61b7ff;border: 1px solid #85e9fc;.el-picker-panel__sidebar { background-color: #08294c !important; border: 1px solid #85e9fc;原创 2021-09-03 14:05:11 · 1483 阅读 · 0 评论 -
按设计稿一比一开发且自适应屏幕
①安装less loadercnpm install less less-loader --save-dev在build目录下的webpack.base.conf.js 下配置loader{ test: /\.less$/, loader: "style-loader!css-loader!less-loader",}②安装lib-flexible插件cnpm i lib-flexible --savemain.js 里 引入 lib-flexible对flexibl原创 2021-11-12 14:43:32 · 344 阅读 · 0 评论