小demo
小芽儿++
希望
展开
-
Vue el-table-column根据行数据添加button和修改对应数据and控制显示条件
插槽详解理解表格代码<el-table-column label="操作"> <template slot-scope="scope"> <el-button :type="scope.row.status?'danger':'primary'" @click="changeStatus(scope.$index)" >{{ scope.row.status?'中断':'执行'}}</el-button> </te原创 2021-12-04 21:01:24 · 4485 阅读 · 0 评论 -
vue + charts绘制图表
安装: npm install echarts参考资源:https://echarts.apache.org/handbook/zh/get-started/创建组件ModeCharts.vue要用到图图表的页面引入<template> <div> <div id="main" style="width: 600px;height:400px;"> </div> </div></template>.原创 2021-11-17 18:35:55 · 200 阅读 · 0 评论 -
wepy小程序(多张卡片)合成动画
描述7张卡片合成一张新卡片7张卡片绕环形旋转方法卡片的初始位置相同,所以每张卡片都需要一个单独的动画来控制它的旋转角度transform-origin控制卡片的旋转路径代码html &lt;repeat for="{{cardsList}}" index="index" key="index" item="item"&am原创 2019-01-15 16:24:01 · 1191 阅读 · 1 评论 -
css实现 顶部弧形, 椭圆,平行四边形,菱形,任意多边形
顶部弧形----html---- <div class="box"> <div class="a"></div> </div>----css----- .box{ width: 200px; height: 400px; border:1px solid #333; ...原创 2018-12-25 16:27:20 · 3969 阅读 · 0 评论 -
钱袋子动画(金币飞出,袋子内动态减少,钱袋子摇晃)
简述粗略构图,请发挥想象力哦,哈哈哈触发点击事件时金币飞出,钱袋子摇晃钱袋子里面的金币总量动态减少思想袋子内部动画就是上面波纹水平移动,金币总量垂直移动(transform:translateX||translateY)钱袋子摇晃就是Z轴上偏移金币飞出主要是用transition-origin代码html &lt;div id="container"&gt; ...原创 2018-12-17 20:17:56 · 2069 阅读 · 0 评论 -
任意角度弧形进度条
简述绘制一个270°的弧形进度条,根据所传入的分数显示进度位置。(可根据需要调整自己的度数)思想将一个正方形分为左右两个矩形左右矩形各画半圆(实际是一个圆超出部分被隐藏了)左边用180°半圆,右边用90°弧形(transform:rotate()旋转得到)--------底色拼完进度条颜色初始通过旋转隐藏通过计算得到相应分数的进度条旋转度数例子参数 可以先看文章最后的效果...原创 2018-12-05 13:20:43 · 1649 阅读 · 0 评论 -
计算某年某月某日到某年某月某日之间的天数
用到的方法/** * 获取x天之前的日期 */function getDateMiusDay(days) { var time = new Date().getTime(); var beforeTime = time - (60 * 60 * 24 * 1000 * days); var newDate = new Date(beforeTime); let str = ...原创 2018-11-26 16:28:13 · 9610 阅读 · 2 评论 -
小程序获取用户当前位置
申请开发者密钥https://lbs.qq.com/console/key.html下载微信小程序JavaScriptSDK安全域名设置,在“设置” -&gt; “开发设置”中设置request合法域名,添加https://apis.map.qq.com实例import QQMapWX from '../utils/qqmap-wx-jssdk.min.js'; //引入SDK核心类...原创 2018-11-20 14:18:14 · 2984 阅读 · 0 评论 -
根据后台返回的数据显示固定数量的信息且根据值不同颜色不同
描述前台共有n个数据,且固定位置数据颜色根据返回值不同而不同数据模型为fruits:{'苹果':{value:'',...},'蜜桃':{value:'',...},'哈密瓜':{value:'',...}.....}后台返回0-n个数据,数据模型为键值对[{name:'苹果',num:'20'},{name:'哈密瓜',num:'60'},..]当第n条数据有值时显示,无值时不显示...原创 2018-11-22 17:01:25 · 1257 阅读 · 0 评论 -
wepy组件控制弹窗淡入淡出,父组件控制内容与显示事件
描述父组件加载子组件父组件传值给子组件(显示内容,显示时长)重复点击同一事件或者不同事件单个显示时长不变(清理定时器)类似弹窗都可转换代码father.wpy //父组件&lt;template&gt; &lt;child :msg.sync="fmsg" :time.sync="ftime"&gt;&lt;/child&a原创 2018-11-13 11:49:26 · 829 阅读 · 0 评论