- 博客(50)
- 收藏
- 关注
原创 前端scale(缩放)
上面这种根据宽度比例进行缩放的,针对1920 * 1080,3840 * 2160(4k)是没有问题的,但是在超宽屏的情况下还是存在只显示一半的问题。动态计算网页宽高比,决定是按照宽度的比例还是高度的比例进行缩放。这种方案的原理就是根据宽高比例进行缩放。(宽度比率=网页当前宽度/设计稿宽度)很多的大屏适配都是使用的这种方案。
2023-06-14 16:43:40 1608
原创 element-ui中Table表格如何合并单元格
<template> <div> <div class="panel"> 1231 </div> <div class="panel"> <el-table :data="skuListInfo" :span-method="objectSpanMethod" border> <el-table-column prop="name" label="名称">
2022-03-24 19:55:09 241
原创 echarts y轴多条线
let echarts = require('echarts') let myChart = echarts.init(document.getElementById('my_line')) myChart.setOption({ grid: { show: false, top: '15%', left: '1%', right: '5%', bottom: '0%', contai
2022-03-22 17:35:23 1703
原创 agan,async,await,isMobile,isRouterShow
// The Vue build version to load with the `import` command// (runtime-only or standalone) has been set in webpack.base.conf with an alias./* eslint-disable */import Vue from 'vue'import App from './App'import router from './router'// 导入vant import '
2022-03-11 10:04:10 2728
原创 【无标题】没一点吊意思
let url = window.location.href if(url.indexOf("?")!=-1){ url = url.replace(/(\?|#)[^'"]*/, ''); window.history.pushState({},0,url); }
2022-03-10 11:17:00 65
原创 父组件调用子组件方法
<AddOrEditMedical ref="AddOrEditMedical" :visible="addsVisible" :eventlist="eventlist" @close-visible="onFinsh" />editMedical(data) { this.$refs.AddOrEditMedical.show(data.id); this.addsVisible = true; },`methods: {show(id) {t
2022-01-08 01:38:29 197
原创 密码规则验证
let testPassword = /(?!^[0-9]+$)(?!^[A-z]+$)(?!^[^A-z0-9]+$)^.{8,18}$/; if (!testPassword.test(this.newUserPassword) || !testPassword.test(this.sureNewUserPassword)) { this.$message.warning('新密码必须由大写字母、小写字母、数字、字符任意两种组成,密码长度最短8位') retu
2021-12-28 13:40:19 222
原创 vue-count-to
npm install vue-count-to<template> <countTo class="ICountUp" :startVal='startVal' :endVal='realTimeNum' :duration='2000' :decimals="decimals" :autoplay="autoplay"></countTo></template><script>import countTo from 'vue-c
2021-11-23 10:10:21 635 1
原创 echarts-gauge-bar
let option = { grid: { show: false, containLabel: true, }, angleAxis: { show: false, max: 200, //-45度到225度,二者偏移值是270度除360度 type: "value", startAngle: 180, //极坐标初始角度
2021-11-09 15:36:29 195
原创 echarts-gauge
initGauge(){ var mychart = echarts.init(document.getElementById('echarts_FGRQ')) mychart.setOption ({ tooltip: { formatter: "{a} <br/>{b} : {c}%" }, series: [ { name: '人群覆盖',
2021-11-09 15:34:05 261
原创 echarts-pieyuan
initPie(dom,value){ let myOption = echarts.init(document.getElementById(dom)) myOption.setOption({ title: { text: `${value}%`, x: 'center', y: 'center', textStyle: { font
2021-11-09 09:32:44 348
原创 Vue大屏数字滚动翻转效果
<template> <div class="chartNum"> <div class="box-item"> <li :class="{'number-item': !isNaN(item), 'mark-item': isNaN(item) }" v-for="(item,index) in orderNum" :key="index"> <span
2021-11-02 17:28:41 2031
原创 echarts-radar
initWang(dom) { let myOption = echarts.init(document.getElementById(dom)) myOption.setOption({ radar: { name: { textStyle: { color: '#333333', borderRadiu
2021-10-28 09:46:59 86
原创 echarts-横向
mounted () { let list = [ { name:'市级医院', value:233, }, { name:'乡镇卫生院', value:533, }, { name:'市级医院', value:133, }, { name:'市级
2021-10-27 16:53:01 579
原创 echarts-pie
<template> <div id="QualityRating"> </div></template><script>import echarts from 'echarts' export default { data() { return { COLORS:['#5B8FF9','#5AD8A6','#F7C739','#44D3E1','#E8684A','#A953F3']
2021-10-26 09:49:00 70
原创 echarts-line
<template> <div id="SignContract"> </div></template><script>import echarts from 'echarts' export default { data() { return { } }, mounted () { let obj = { name: "签约人数
2021-10-26 09:42:41 117
原创 Vue自定义组件挂载到全局
1.在mian.js文件中引入import Vue from 'vue'import '@/components/index' // 注册全局组件2.在/components/index.js文件中引入所需要组件import Vue from 'vue'import Empty from './Empty.vue'import FooterBar from './FooterBar.vue'Vue.component('y-empty', Empty)Vue.component(
2021-10-14 12:23:11 953
原创 Vue自定义函数挂载到全局方法
使用exports.install+Vue.prototype(推荐)在crypto.js文件中创建自己的自定义的方法Crypto()。import CryptoJS from 'crypto-js'export default{ install(Vue){ Vue.prototype.Crypto = function (word, getkey) { console.log(word,getkey) var key = CryptoJS.enc.Utf8.pa
2021-10-14 11:49:00 238
原创 如何优雅的在vue组件销毁时去除定时器,可以避免在组件实例身上定义timer。
created() { const timer = setInterval(()=>{ console.log('1') },1000) this.$once('hook:beforeDestroy', ()=> clearInterval(timer)) }
2021-10-09 11:05:48 124
原创 原生封装单选框
原生<template> <m-page> <div slot="content"> <div class="box"> <div class="options" id="options"> <div class="box-warp"> <a href="javascript:;"> <p cl
2021-09-02 14:26:02 260
原创 vue封装radio组件
子组件<template> <div class="radio"> <label class="title">{{title}}</label> <a href="#" v-for="(item, index) in options" :key="index" class="radioLink"> <div class="radioList">
2021-09-02 14:25:35 168
原创 formData文件上传
1、export const UPLOAD = (file) => { let form = new FormData() form.append('file', file) return new Promise((resolve, reject) => { resolve(res) reject(error) })}2UPLOAD(file).then(res => {//file=e.target.files[0] document.get
2021-08-02 10:10:35 81
原创 找一下人员?。。?
let pdf = ['白建辉','白山朋','鲍洋洋','蔡冬梅','曹季英','常小龙','陈大福','陈高运','陈海燕','陈佳璐','陈建正','陈进城','陈军良','陈守亮','陈小勇','陈永桥','陈重修','陈祖强','程海燕','程学良','崔雪龙','戴海军','丁玉兰','杜陈士','段文学','范立斌','方世国','冯卫华','冯小平','傅阳峰','付建明','付友宜','付余佳','高国强','龚建雄',
2021-07-03 17:51:02 208
原创 微信扫码登录
先head引入 <script type="text/javascript" src="http://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js"></script><div id="login_container"></div>setWxerwma() { const obj = new WxLogin({ self_redirect: true, id
2021-07-02 08:50:57 73
原创 uniAPP微信小程序通过webview跳转到其他网址
注意:目前通过webview跳转到其他网址支持:1、与微信小程序绑定的微信公众号文章地址;2、在微信小程序后台配置好业务域名的地址。1、新建一个只有webview组件的页面<template> <view> <view> <!-- url为要跳转外链的地址--> <web-view :src="url"> </web-view>
2021-06-17 16:34:32 1994
原创 better-scroll横向滑动
npm install better-scroll --save<div class="person-wrap" ref="personWrap"> <ul class="person-list" ref="personTab"> <li class="person-item">import BScroll from 'better-scroll'created() { this.$nextTick(() => {
2021-06-11 17:17:30 319
原创 使用ElementUI自带的DatePicker 日期选择器,加入验证类型为 type=“date“时报错
首先说明出现原因,elementUI的日期选择器【el-date-picker】在加上格式value-format=“yyyy-MM-dd” format=“yyyy-MM-dd”和校验规则时{ type: ‘date’, required: true, message: ‘请选择日期’, trigger: ‘change’ }由于加入了type=“date”,导致上述的错误解决方式: 将type改为“string"或者直接删除这一项原因可能是:elementUI自带的格式转换后会将绑定值转为.
2021-06-04 09:27:43 2209
原创 js获取当前时间的前一周
const date = new Date() for(var i=0;i<7;i++){ let newDate=new Date(date.getTime()+i*1000*60*60*24) let year=newDate.getFullYear() let month=(parseInt(newDate.getMonth())+1)>9?(parseInt(newDate.getMonth())+1):"0"+(parseIn
2021-05-28 13:50:41 1319
原创 这个js小数点失真是为了什么?
方法一: 乘以100或除以100之后保留两位小数parseFloat((num*100).toFixed(2))方法二:// 除以100保留两位小数点 function divideByHundred(str) { let floatVal = parseFloat(str); if (isNaN(floatVal )) { return 0; } floatVal = Math.round(str * 100) / 10000
2021-05-27 17:54:01 101
原创 满意度echarts
initEchartRadar() { this.mydpc = echarts.init(document.getElementById('mydpc')) this.mydpc.setOption({ title: { show: false }, legend: { show: false }, radar: { name: {
2021-04-12 09:26:01 179
原创 js生成二维码
import QRCode from 'qrcode' // import引入可能会导致报错,可以尝试require// const QRCode = require('qrcode'); // With promisesQRCode.toDataURL('I am a pony!') .then(url => { console.log(url) }) .catch(err => { console.error(err) })Example: .
2021-04-06 10:45:17 70
原创 条形码JsBarcode
import JsBarcode from 'jsbarcode'JsBarcode("#barcode", jiuZhenKH, { width:4, height:60, lineColor:"#333", displayValue: false .
2021-04-06 10:21:32 112
原创 vue实现短信验证码弹窗
<div class="dialog-mask" v-if="display"> <div class="dialog " id="dialog"> <div class="title">请输入授权验证码</div> <div class="input"> <input id="first" class="inputStyle" v-model="code[0]" style="
2021-03-25 19:59:34 890
原创 微信刷脸api
wx.invoke('checkIsSupportFaceDetect',{},(res)=>{ if(res.err_code == 0){ this.$createDialog({ type: "confirm", title: "温馨提示",
2021-03-24 11:02:21 1132
原创 js获取上午下午
judgeTime(time){列:date:'2021-03-18 09:28:34' let date = new Date(time.replace(/-/g, '/')) let hours = date.getHours() if(hours >= 0 && hours < 12){ return '上午' }else{ return '下午' } }, jud
2021-03-18 12:05:42 1249
原创 时分秒倒计时---方法
总秒数CountDown(){ let maxtime = 30 //倒计时间总秒数 this.timer = setInterval(()=>{ if (maxtime >= 0) { let hour = Math.floor((maxtime / 3600) % 24); let minutes = Math.floor((maxtime / 60) % 60); let seconds
2021-03-01 13:17:23 457
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人