- 博客(85)
- 资源 (1)
- 收藏
- 关注
原创 Promise.all循环中使用async/await
前端中,当在Promise.all循环中使用async/await时,首先,async函数会返回一个Promise,而await关键字用于等待这个Promise解决。但是,当你在循环中使用await时,然而,如果你将循环中的异步操作封装成Promise对象,并将这些Promise对象传递给Promise.all,那么Promise.all会等待所有这些Promise对象都解决后才继续执行后续的代码。但是,这并不意味着循环本身会等待Promise.all解决;
2025-01-14 18:45:00
380
翻译 Vue中computed属性简介
计算属性用于使代码更易于使用。这使我们的模板代码更具可读性;我们使用该属性来减少我们在模板中编写的复杂或模糊的逻辑。如果我们有简单的逻辑,如字符串连接或布尔表达式,我们可以使用内联表达式或插值,但对于更复杂的逻辑,我们应该选择Vue.js中的计算属性。语法我们需要使用‘computed’关键字来使任何函数充当计算属性以使用此属性。如需了解更多信息,请参见下文。在上面的语法中,我们使用了computed关键字,在其中,我们定义了需要计算的函数。......
2022-07-31 22:43:14
362
翻译 Vue中nextTick()简介
Vue.jsnextTick是vue.js中的全局api之一,它主要推迟了执行javascript的dom(文档对象方法)生命周期的回调方法,它不断地执行dom方法,因为当我们使用它时,它会一个接一个地使用。在vue.js中有一些默认的方法来实现前端和后端的应用程序逻辑。上面的代码是在UI端的脚本中渲染vue组件时使用默认方法$nextTick()的基本语法,因为它用于在我们更改Vue中的其他一些区域后更改dom中的数据代码。......
2022-07-31 22:42:55
307
翻译 OpenLayers与Leaflet之间的区别
OpenLayers 和 Leaflet 都提供了常见的功能,如平铺层、矢量图层和应用程序的移动支持。OpenLayers 中的平铺层可以根据用户的要求从任何网页中提取信息。此外,如果需要,还可以使用未缝合的层。地理空间地图服务也可以根据需要使用。Leaflet提供了缩放选项,以便用户在滚动地图时可以在平铺层中找到确切位置。我们可以在手机上安装这两个应用程序,但 Leaflet 更轻量级。OpenLayers 正在构建轻量级和移动友好的组件,以便用户可以使用它们。...
2022-06-28 21:45:00
4527
转载 Vue中使用原生js实现拖动div框
HTML标签<div class="overView" id="overView" v-show="overViewFlag"> <div class="sgnqResultTitle" id="overViewTitle"> 标题 </div> <div class="overViewPieDiv"> <div>内容</div> </div></di
2022-03-01 21:45:00
328
原创 vue中实现PC端适配
文章主要是参考https://blog.youkuaiyun.com/weixin_41257563/article/details/97266234改写的自适应方案核心: 阿里可伸缩布局方案 lib-flexiblepx转rem:px2rem,它有webpack的loader px2rem安装依赖包npm i lib-flexible -savenpm i postcss-px2rem -savemain.js文件引用// main.jsimport 'lib-flexible'在node_mo
2021-12-26 17:55:35
858
转载 本地项目上传到码云
1,首先在码云上新建一个项目2,本地新建一个文件夹3,进入新建的文件夹,点击鼠标右键,选择git bash here然后在窗口输入 git init 这时候文件夹会多出一个.git文件夹,看不到文件夹的,点击鼠标右键选择“显示不显示隐藏的文件”就可以看到这个文件夹了4,进入刚刚在码云新建的项目里,复制框框里的路径5,然后在回到本地新建的文件夹里继续操作git输入git remote add origin + 你刚刚在码云复制的那行路径6,继续输入 git pull origin
2021-12-18 22:20:03
126
转载 vue-pdf实现pdf文件在线预览
有空改npm install --save vue-pdf<template> <div> <pdf ref="pdf" :src="url" > </pdf> </div></template><script>import pdf from 'vue-pdf'export default { components:{
2021-07-31 17:51:15
403
原创 cesium中缓冲区分析
效果这里是点缓冲区与点数据分析的15000个点代码添加缓冲区 /** * @Description: 初始化点缓冲 * @param centerPoint 缓冲区中心点 * @param dataPoint 缓冲区分析的数据 * @param bufferDistance 缓冲区距离 * @return ptsWithin 缓冲区分析结果 */ initPointBuffer(centerPoint, dataPoint, b
2021-07-25 19:43:17
1485
转载 vue中使用MathJax展示数学公式
##### 效果##### 引入第三方包```<script type="text/javascript" async src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js?config=TeX-MML-AM_CHTML"></script>```##### 创建js文件用于配置公式`
2021-06-30 18:21:08
1319
3
原创 react中添加背景音乐
先贴代码,有空整理<script> //背景音乐 function playClicked(element) { $(this).toggleClass("rotate"); if (audio_player.paused) { audio_player.play(); newdisplay = "./Content/campuslife/musicplay
2021-06-30 18:17:49
1258
1
转载 vue.config.js 配置
vue-cli3 脚手架搭建完成后,项目目录中没有 vue.config.js 文件,需要手动创建创建vue.config.jsvue.config.js 是一个可选的配置文件,如果项目的 (和 package.json 同级的) 根目录中存在这个文件,那么它会被 @vue/cli-service 自动加载。你也可以使用 package.json 中的 vue 字段,但是注意这种写法需要你严格遵照 JSON 的格式来写。在根目录中创建 vue.config.jsvue.config.js配置这
2021-04-30 23:45:27
423
1
原创 Vue项目中v-for渲染列表缓慢问题
vue+elementUI中表格渲染数据,使用v-for循环添加字段,加载近200个字段加载缓慢,最后使用key属性后加载明显变快。:key是为vue的响应式渲染提供方法,在列表中单条数据改变的情况下,可以进行单独渲染,减少页面资源消耗。使用:key="items.id"的属性有利于代码的优化,减少页面资源消耗。...
2021-04-30 23:41:53
6665
2
转载 Vue中取消正在请求中的接口
vue接口请求配置中加入拦截器// request拦截器service.interceptors.request.use(config => { // console.log("sessionStorage.token:", sessionStorage.token); // Do something before request is sent // if (store.getters.token) { if (getToken()) { conf
2021-03-28 19:48:59
2707
原创 echarts 加载地图双击地图下深
offLineMap(regions) { let _this = this;_this.chinaMapData = require('../../public/datas/china/china.json');_this.provinceMapData = { '上海市': require('../../public/datas/province/data-1482909900836-H1BC_1WHg.json'), '河北省': require('../../publi.
2021-03-28 18:48:28
519
原创 Echarts 柱状图及折线图
效果功能防止悬浮框溢出图例图标宽高度修改柱状图之间间距设置X轴数据名称柱状图内显示(注释)X轴数据名称倾斜显示X轴文字显示优先级(注释)柱状图初始显示数量柱状图颜色渐变折线图点大小鼠标点击,滚动,拖动柱状图展示所有数据代码let option = { tooltip: { trigger: 'axis', confine: true, // 防止悬浮框溢出图表 }, grid: { bottom: "21
2021-02-28 20:35:53
1643
原创 cesium中加载点图标
贴代码// primitives可加载大量数据,性能方面比entities要好一些let billboard = viewer.scene.primitives.add(new Cesium.BillboardCollection());billboards.add({ image: imgUrl, // 图片地址 width: 22, height: 22, // scale: 1.0, // sizeInMeters : true, //图像的尺寸被指定成
2021-01-30 21:44:33
3763
1
原创 Cesium中加载geojson数据,根据数据中的属性做等级展示
cesium加载GeoJson数据,并做等级显示效果const promise = viewer.dataSources.add(Cesium.GeoJsonDataSource.load(urlChina));//默认是黄色promise.then(function (dataSource) { _this.jsonDatas[keydataSource] = dataSource; const entities = dataSource.entities.values;
2021-01-30 21:34:53
2308
原创 Vue+vant移动端处理弹框滑动问题
Vue+vant做移动端需要实现一个弹框向上下滑动的功能遇到了问题记录一下<div class="popupShowHeight" id="popupShowHeight" v-show="popupShow" > <van-popup v-model="popupShow" :round="true" position="bottom" :overlay="false" :style="{ height: popupShowHeight + '%
2020-12-27 19:29:20
2969
2
转载 cesium中长度测量和面积测量
效果vue+cesium做的测量功能,参考网上修改// *************测量空间直线距离************ static measureLineSpace() { this.removeMeasure(); let _this = this; let viewer = this.viewer; // 取消双击事件-追踪该位置 viewer.cesiumWidget.screenSpaceEventH
2020-11-29 09:38:27
3094
3
原创 vue中刷新页面后保存当前选中样式
localStorage 和 sessionStorage 属性允许在浏览器中存储 key/value 对的数据。localStorage 用于长久保存整个网站的数据,保存的数据没有过期时间,直到手动去删除。
2020-11-01 20:50:35
1406
原创 VUE+Cesium项目搭建
效果如下:一、 安装cesium包npm install cesium –save二、 在build/webpack.dev.conf.js下配置参数const cesiumSource = 'node_modules/cesium/Source'const cesiumWorkers = '../Build/Cesium/Workers'new CopyWebpackPlugin([{ from: path.join(cesiumSource, cesiumWorkers), to: '
2020-08-28 17:15:43
1097
1
原创 VUE非父子组件之间通信的几种方式
一.使用广播的方式$emit(), $on()1.创建js文件import Vue from 'vue'export default new Vue()组件Aimport bus from '../../static/js/commonvue'mounted() { bus.$emit('componentsA', ‘组件A的值’); //传值}组件Bimport bus from '../../static/js/commonvue'mounted() { bus.$
2020-08-27 17:08:13
3164
原创 Vue项目在局域网中访问
查看网上有很多种方法可以用这种方法试下:1.修改config文件夹里index.js文件的host属性,将localhost改为本地的IP查看本地IP方法,cmd控制台中输入ipconfig,IPv4地址就是了。2.webpack.dev.conf.js文件中添加属性 useLocalIp: true这样运行项目就OK了。...
2020-06-30 17:31:58
1515
原创 openlayers加载天地图及天地图地形图影像图
export function tianditu(map) { // T=vec_c表示请求的是路网数据,x 表示切片的 x 轴坐标,y 表示切片的y轴坐标,z表示切片所在的缩放级别。 // 使用 ol.source.XYZ 加载切片,并将获取的数据初始化一个切片图层 ol.layer.Tile: //天地图底图 var source = new XYZ({ url: "http://t4.tianditu.com/DataServer?T=vec_w&tk=6cb8af42
2020-05-31 17:06:52
12671
1
原创 编程实现水仙花数
水仙花数定义各个位数立方和等于它本身的三位数。通过上面已知水仙花数是一个三位数,也就是100到999之间;要求是每位数的立方和等于它本身。分析:假设要判断的数是num则这上数的个、十、百位的数字应该是:个位:g=num%10;S=num/10%10;B=num/100;要求满足条件:ggg+sss+bbb==num;所以用穷举的方法代码如下:#include "stdio.h"v...
2020-04-29 17:04:31
3136
1
原创 openlayers萤火图实现
先放代码,有空在改在这里插入图片描述// 萤火图var ChinaBlue, fireData;export function initFirefly(viewMap) { map = viewMap; fireFly()}function fireFly() { if(ChinaBlue) map.removeLayer(ChinaBlue); if(fireDa...
2020-03-31 23:16:26
485
原创 openlayers点图元渲染及画圆
下面是openlayers点图元渲染效果图及在4326坐标系中画圆效果图。因为功能需要所以写的可能有点麻烦,只截取了方法实现的代码。 // 渲染点图标及画圆 renderIcon(rows) { let rows = {}; rows.centerPoint = "116.64560693, 40.05946214"; let self = this; self.vectorSource = new VectorSource(); // 图元数据源 self
2020-03-31 22:54:15
1455
1
原创 VUE中父子组件之间传值
VUE 中父组件向子组件传值直接贴代码了,这里是片段代码,仔细看并尝试写一下应该是没有问题的。父组件:<template><div> <companyInfo ref="companyInfo" :companyinfo="companyinfo" ></companyInfo></div> </template>...
2020-02-29 09:49:04
364
原创 openlayers加载MapServer地图服务
引入proj4脚本文件<script src="https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.4.4/proj4.js"></script>这里加载的坐标是EPSG:4527的Mapserver的地图服务代码如下<div id="viewDiv"></div><script>...
2020-01-12 09:31:40
2905
原创 Error in render: "TypeError: Cannot read property 'accessCount' of null" found in
VUE中报错Error in render: “TypeError: Cannot read property ‘accessCount’ of null” found in错误原因:异步的数据是先显示vuex中的初始数据,然后显示请求数据,刚开始vuex中state中的初始数据为空,所以页面在显示初始数据的时候报错。解决方法:初始化时将所要监听的对象用空数组[]赋值即可解决模板标...
2020-01-12 09:08:10
661
原创 openlayers鹰眼图实现
这个是Cesium三维地图结合openlayers二维地图的鹰眼图实现,代码有相关注释。// 创建鹰眼图this.map = new Map({ layers: [layers_arcgis], target: 'map2d', view: new View({ projection: 'EPSG:4326', center: [116....
2020-01-04 11:18:32
1719
1
原创 最短路径分析的算法
Floyd-Warshall(弗洛伊德算法)弗洛伊德算法的主要思想是通过第三点来缩短两点间的路径,例如顶点a和顶点b之间的路径为dis[a][b],如果想使a,b之间的路径缩短,只有引入第三点k,并通过k点来中转,即a->k->b,才可能缩短a,b之间的路径,那么这个k点是哪个点呢,其实并不唯一,k点也有可能有多个,但可以确定的是,在经过k点中转后,所得到的dis[a][k]+dis...
2019-12-01 09:46:34
1026
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人