- 博客(18)
- 收藏
- 关注
原创 vue可视化大屏自适应
<template> <div id="bigScreen"> </div></template><script> export default { name: "bigScreen", data(){ return{ } }, mounted() { this.setBodyCss()
2021-11-02 14:14:54
722
2
原创 微信扫码登录
前端代码<div id="login_container"></div><script src="http://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js"></script> var obj = new WxLogin ({ id: "login_container",//div的id self_redirect: true,//true将页
2021-11-02 11:35:38
254
原创 uniapp视频播放默认全屏(横屏显示)
<template> <view> <video :src="videoUrl" @play="playVedio()" @fullscreenchange="screenchange" id="video"></video> </view></template><script>export default { data() { return { videoUrl: 'http://125246
2021-10-26 11:32:23
4823
原创 使用高德地图api点聚合案例 (自定义样式)
高德地图api地址:https://lbs.amap.com/api/javascript-api/reference/map 1.异步创建script标签注意需要MarkerClusterer插件(https://webapi.amap.com/maps?v=1.4.15&key=你的key&callback=initAMap&plugin=AMap.MarkerClusterer)export default function MapLoader() { ret.
2021-08-05 18:32:25
1595
2
原创 uniapp使用高德地图api找车位简单案例
功能:随着地图移动红色标点跟着变化并在其范围内出现最近的10个停车场,并按距离排序。点击蓝色标点会出现其对应的信息窗口右下角定位功能(点击回到当前所在位置)(因使用静态数据,所以蓝色标点不会刷新)高德地图api地址:https://lbs.amap.com/api/javascript-api/reference/map 1.异步创建script标签export default function MapLoader() { return new Promise((resolve,.
2021-08-05 09:22:30
1289
3
原创 高德地图api的简单使用
在html页引入<link rel="stylesheet" href="https://a.amap.com/jsapi_demos/static/demo-center/css/demo-center.css" /><script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=你的key"></script>开始使用<script> .
2021-08-03 11:31:49
791
原创 uniapp map简单使用
<template> <view> <map style="width: 100%; height:100vh;" :latitude="latitude" :longitude="longitude" :scale="scale" :markers="covers"></map> </view></template><script> export defaul.
2021-07-30 14:04:52
246
原创 数字加载动画(vue-count-to)
vue-count-tonpm install vue-count-to页面引入import countTo from 'vue-count-to';export default { components: { countTo },}3.使用<countTo separator="," :startVal='0' :endVal='3215' :duration='5000' autoplay></countTo>人...
2021-07-28 14:33:56
418
1
原创 vue代理解决跨域步骤
在src目录下创建api文件,封装https.jsimport axios from 'axios'axios.defaults.timeout =30000// 添加响应拦截器axios.interceptors.response.use(function (response) { //可以写if判断,提前拦截错误信息 return response;}, function (err) { return Promise.reject(err);});e
2021-07-26 17:36:52
87
原创 uniapp 移动端分页加载模板
<template> <view> </view></template><script> export default { data() { return { dataList: [], dataSource: { isLoading: true, pageNo: 1, pageSize: 10 }, url:{ list:'', },
2021-07-26 10:57:00
261
原创 canvas贝塞尔曲线加渐变动画效果
<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>Canvas</title></head> <style> #myCanvas{ border:1px solid #cccccc; } </style><body> &.
2021-07-14 11:37:29
447
原创 安装node-sass时遇到的问题
1.什么是node-sass对于在项目中使用sass的语法的时候,需要通过sass-loader来解析sass,从而使sass语法变成浏览器能够识别的css语法,而node-sass模块就是对sass-loader的支持模块。2.安装来源问题可以尝试通过淘宝的npm镜像来安装。npm install -g cnpm --registry=https://registry.npm.taobao.org在项目文件夹下安装node-sasscnpm install --save-dev n
2021-06-29 18:24:08
162
原创 vue无限滚动插件( vue-seamless-scroll)
需要用到 vue-seamless-scroll.min.js .seamless-warp { width: 100%; height: 200px; overflow: hidden; }<script src="../js/vue-seamless-scroll.min.js"></script><vue-seamless-scroll :data="data" class="seamless-warp" :class-option=
2021-06-21 18:37:11
1733
原创 echarts按指定字数换行
formatter: function (value) { var retter = ""; var maxLength = 10; var valueLength = value.length; var rowNumber = Math.ceil(valueLength / maxLength); if (rowNumber > 1) { for (var i = 0; i < rowNumber; i++) { va..
2021-06-21 18:17:50
219
原创 echarts最大值最小值加气泡样式及平均线
markPoint: { symbol: 'pin', //标记(气泡)的图形 symbolSize: 45, //标记(气泡)的大小 itemStyle:{ color: '#2f54eb', //图形的颜色。 borderColor: '#2f54eb',//图形的描边颜色。 borderWidth: 0,//描边线宽。 borderType..
2021-06-21 18:05:34
1498
原创 echarts左右轮播动画效果
echarts左右轮播动画效果data:{ timerId:'',//定时器标识 startValue: 0,//开始 endValue: 3,//结束(显示数据量) data:[],}在option中添加dataZoom属性及设置定时器 setEcharts(){ option={ dataZoom: { show: false, startValue: this.startValue, endValue: t
2021-06-21 17:55:22
509
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人