- 博客(84)
- 资源 (1)
- 收藏
- 关注
RSS订阅翻译 Vue中computed属性简介
计算属性用于使代码更易于使用。这使我们的模板代码更具可读性；我们使用该属性来减少我们在模板中编写的复杂或模糊的逻辑。如果我们有简单的逻辑，如字符串连接或布尔表达式，我们可以使用内联表达式或插值，但对于更复杂的逻辑，我们应该选择Vue.js中的计算属性。语法我们需要使用‘computed’关键字来使任何函数充当计算属性以使用此属性。如需了解更多信息，请参见下文。在上面的语法中，我们使用了computed关键字，在其中，我们定义了需要计算的函数。......
2022-07-31 22:43:14
313
翻译 Vue中nextTick()简介
Vue.jsnextTick是vue.js中的全局api之一，它主要推迟了执行javascript的dom（文档对象方法）生命周期的回调方法，它不断地执行dom方法，因为当我们使用它时，它会一个接一个地使用。在vue.js中有一些默认的方法来实现前端和后端的应用程序逻辑。上面的代码是在UI端的脚本中渲染vue组件时使用默认方法$nextTick()的基本语法，因为它用于在我们更改Vue中的其他一些区域后更改dom中的数据代码。......
2022-07-31 22:42:55
280
翻译 OpenLayers与Leaflet之间的区别
OpenLayers 和 Leaflet 都提供了常见的功能，如平铺层、矢量图层和应用程序的移动支持。OpenLayers 中的平铺层可以根据用户的要求从任何网页中提取信息。此外，如果需要，还可以使用未缝合的层。地理空间地图服务也可以根据需要使用。Leaflet提供了缩放选项，以便用户在滚动地图时可以在平铺层中找到确切位置。我们可以在手机上安装这两个应用程序，但 Leaflet 更轻量级。OpenLayers 正在构建轻量级和移动友好的组件，以便用户可以使用它们。...
2022-06-28 21:45:00
4289
转载 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
281
原创 vue中实现PC端适配
文章主要是参考https://blog.csdn.net/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
816
转载 本地项目上传到码云
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
92
转载 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
355
原创 cesium中缓冲区分析
效果这里是点缓冲区与点数据分析的15000个点代码添加缓冲区 /** * @Description: 初始化点缓冲 * @param centerPoint 缓冲区中心点 * @param dataPoint 缓冲区分析的数据 * @param bufferDistance 缓冲区距离 * @return ptsWithin 缓冲区分析结果 */ initPointBuffer(centerPoint, dataPoint, b
2021-07-25 19:43:17
1377
转载 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
1225
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
1131
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
381
1
原创 Vue项目中v-for渲染列表缓慢问题
vue+elementUI中表格渲染数据，使用v-for循环添加字段，加载近200个字段加载缓慢，最后使用key属性后加载明显变快。:key是为vue的响应式渲染提供方法，在列表中单条数据改变的情况下，可以进行单独渲染，减少页面资源消耗。使用:key="items.id"的属性有利于代码的优化，减少页面资源消耗。...
2021-04-30 23:41:53
6364
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
2603
原创 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
476
原创 Echarts 柱状图及折线图
效果功能防止悬浮框溢出图例图标宽高度修改柱状图之间间距设置X轴数据名称柱状图内显示（注释）X轴数据名称倾斜显示X轴文字显示优先级（注释）柱状图初始显示数量柱状图颜色渐变折线图点大小鼠标点击，滚动，拖动柱状图展示所有数据代码let option = { tooltip: { trigger: 'axis', confine: true, // 防止悬浮框溢出图表 }, grid: { bottom: "21
2021-02-28 20:35:53
1532
原创 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
3506
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
2161
原创 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
2852
2
转载 cesium中长度测量和面积测量
效果vue+cesium做的测量功能，参考网上修改// *************测量空间直线距离************ static measureLineSpace() { this.removeMeasure(); let _this = this; let viewer = this.viewer; // 取消双击事件-追踪该位置 viewer.cesiumWidget.screenSpaceEventH
2020-11-29 09:38:27
2927
3
原创 vue中刷新页面后保存当前选中样式
localStorage 和 sessionStorage 属性允许在浏览器中存储 key/value 对的数据。localStorage 用于长久保存整个网站的数据，保存的数据没有过期时间，直到手动去删除。
2020-11-01 20:50:35
1332
原创 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
1051
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
3021
原创 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
1452
原创 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
12201
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
3074
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
443
原创 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
1366
原创 VUE中父子组件之间传值
VUE 中父组件向子组件传值直接贴代码了，这里是片段代码，仔细看并尝试写一下应该是没有问题的。父组件：<template><div> <companyInfo ref="companyInfo" :companyinfo="companyinfo" ></companyInfo></div> </template>...
2020-02-29 09:49:04
305
原创 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
2712
原创 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
632
原创 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
1647
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
981
原创 编程中排序的几种方法
（1）插入排序分析： 插入排序就是通过数字插入有序数组的方式进行排序的， 代码简单， 且易理解。时间复杂度O(N*N)代码如下：template <typename T>void InsertSort(vector<T>& array){ for(int i=0; i<array.size(); ++ i) { for...
2019-12-01 09:46:24
4104
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人