- 博客(19)
- 收藏
- 关注
RSS订阅原创 Cesium加载czml数据并获取实体经纬度
Cesium在加载czml数据时，czml数据会包含图元，有时我们需要获取到实体的经纬度进行下一步操作。这时我们需要使用Cesium的时间属性CesiumTimeInterval去侦听每一秒的变化，从而获取到实体的经纬度。addCzmlDataSource2(viewer){ let czmlDataSourcePromise = Cesium.CzmlDataSource.load('../../static/data/Vehicle.czml'); czmlDataSour
2021-08-21 16:13:33
1740
原创 中央事件总线的一个简单应用
这个案例是个简单的简历筛选的一个小demo，通过点击上方li列表下方的基本信息及个人经历列表进行自动去渲染。这里我用到了中央事件总线，进行组件消息的发布与接收。样式部分引入了ElementUi。先进行组件划分这里我是将三部分划分为单独的组件...
2020-12-07 09:21:39
167
1
原创 vue组件传值（一）中央事件总线
在使用Vue框架中，组件之间传值是我们经常使用到的一项技能。比如我们依赖的父组件正向传值给子组件，子组件逆向传值给父组件，兄弟组件之间传值，vuex等，这里我来总结一下中央事件总线的用法。中央事件总线依赖于$emit实例本身触发事件。下面就来看一下吧：在src/assets/下创建一个xxx.js文件在其中只创建一个新的Vue实例，以后它就承担起了组件之间通信的桥梁了，也就是中央事件总线。在publicBus.js中创建一个新的Vue实例：import Vue from "vue"expo
2020-12-06 14:27:31
468
原创 使用VUE：v-for获取列表前n个数据、中间范围数据、末尾n条数据的方法
1.获取6到13之间的数据：items.slice(6,13)<li v-for="(item,index) in items.slice(6,13)" :title="item.title" :key='index'> <a :href="item.url" :title="item.title" class="list-url"> <img :src="item.src" :alt="item.title" class="list-img"/&g
2020-08-02 22:44:56
10178
6
原创 在原生H5中使用mock模拟数据
之前写过在react项目中如何使用mock数据，因为最近在写原生H5，所以在这里总结一下原生中如何使用mock数据。1.在项目中下载mockjs并引入<script src="./node_modules/mockjs/dist/mock.js"></script>2.建立MockJson.jsMock.mock( 'index', //这里对应下面mock请求的URL { "data":[ {"id":"0","title":"1.不知道如何预约体检
2020-07-22 00:12:01
767
原创 vue中的事件修饰符
hello大家好呀！Vue.js为指令v-on提供了多个修饰符，方便我们处理一些DOM事件的细节，并且修饰符可以串联使用。主要的修饰符如下：.stop :等同于调用event.stopPropagation()。.prevent :等同于event.preventDefault()。.capture :使用capture模式添加事件监听器。.self :只当事件是从监听元素本身触发时才触发回调。使用方法如下：...
2020-07-18 18:06:12
107
原创 使用localStorage完成Vue项目中的历史搜索
在一些电商项目中，我们经常会看到记录历史搜索的功能，如下图所示。我们今天来使用localStorage结合Vue来完成这一功能。1.首先第一步就是获取到搜索框的值，并存入localStorage里面 <span @click="sousuo()">搜索</span> methods: { sousuo(){ if(this.$refs.userinput.value == ""){ return false
2020-05-13 15:24:41
544
原创 Vue中获取input输入框值的两种方式
在使用Vue开发中，我们会常常获取input框的值，在这跟大家总结一下我常用的两种方式。使用ref获取input框的值<template> <div> <div class="logininfor"> <input type="text" placeholder="手机号码" ref="userphone"...
2020-05-05 09:54:09
10732
原创 Vue项目中实现点击变色
在Vue开发中我们经常会遇到这样点击高亮的场景，今天我们就来实现一下这样的功能。首先准备要循环的数据data() { return { arr1:[ {title:"精选"}, {title:"美食"}, {title:"女装"}, ...
2020-04-29 21:55:02
3637
原创 修改swiper轮播图下部的小点点
在日常开发中我们使用swiper插件时，底部的小点点需要修改成如上图样式的形状，那么上代码吧 <!-- Add Pagination --> <div class="swiper-pagination"> </div>上面代码即为html中s...
2020-04-20 11:41:39
3941
原创 前端面试题：display:none;opacity:0;visibilty:hidden;区别与联系
共同点：他们都会让元素隐藏；区别：结构display:none会让元素完全从渲染树中消失，渲染时不再占据任何空间，不能点击；visibilty:hidden不会让元素从渲染树上消失，渲染元素继续占据空间，只是内容不可见，不能点击；opacity:0不会让元素在渲染树中消失，渲染元素继续占据空间，只是内容不可见，可以点击；继承display:none和opacity:0：是非继承...
2020-04-20 11:20:03
910
原创 javascript中的Date属性及倒计时的完成
在日常开发过程中，我们会经常使用到Date属性来完成倒计时等一些需求。那么我们就来看一下这个Date。要创建一个日期对象，使用new操作符和Date构造函数即可。1. 没有参数时返回当前的系统时间var newDate = new Date(); console.log(newDate) //new Date()没有参数时返回系统当前的时间2. new Date()有参数时，返回我们设...
2020-02-18 11:28:17
202
原创 javascript中的arguements及arguements.callee的理解
ECMAScript函数的参数与大多数其他语言中函数的参数有所不同。ECMAScript函数不介意传递进来多少个参数，也不在乎传进来参数是什么数据类型。也就是说，即便你定义的函数只接收两个参数，在调用这个函数时也未必一定要传递两个参数。 可以传递个、三个甚至不传递参数，而解析器永远不会有什么怨言。之所以会这样，**原因是ECMAScript中的参数在内部是用一个数组来表示的。**函数接收到的始终都...
2020-02-16 13:11:42
462
原创 关于for循环的块级作用域问题总结（一）
最近有小伙伴问到关于for循环和作用域的问题，那么我们今天来总结 一下，遇到这样的问题应该如何解答，当for循环和异步操作又会产生奇妙的作用，今天先不进行总结先看个正常的for循环吧for(var i = 0;i < 5;i++){ console.log(i)}1.这是个最简单的for循环的遍历，控制台将打印0,1，2 , 3，4我们来将这个代码变动一下：for (v...
2020-01-14 03:51:33
1881
原创 JavaScript中的作用域问题
JavaScript中的作用域是个基础的知识点，但它又像一个狗皮膏药一样。来吧！面对疾风吧！作用域概念作用域就是变量和函数的可访问范围，控制着变量和函数的可见性与生命周期，在JavaScript中变量的作用域有全局作用域和局部作用域；简单来讲作用域就是变量的作用范围分类：1.全局作用域2.函数作用域（局部作用域）全局作用域全局作用域的特点：1.直接写在script标签中的js中的...
2020-01-11 17:44:16
144
原创 搞定响应式布局
最近有的小伙伴面试会被问到响应式布局媒体查询的相关知识，这篇博文我就来给大家总结一下响应式布局的相关知识。响应式布局是什么呢？响应式布局时2010年5月份提出来的一个概念。是指根据不同设备浏览器分辨率或尺寸来展示不同页面结构、行为、表现的设计方式。例如我们用电脑、手机、平板等设备访问同一个网页展示出来的效果却是不一样的。这里我们就拿匹克的官网来看吧，我们打开匹克的官网是这样子的：当我把窗...
2020-01-02 18:19:31
127
原创 使用jQuery完成小米官网图标
各位小伙伴们大家新年好呀！在此我祝愿各位在新的一年里顺风顺水，不脱头发早脱单。好了，废话不多说，因为之前写项目遇到过类似小米官网home图标那样的效果，最近发现对这块还有点遗忘了。所以咱们今天来通过jQuery简单的方式来还原这个效果。小米官网顶部图标的样子，当我们鼠标放上去的时候显示图2的房子logo，鼠标滑出时显示MI的logo，当然您可以去小米官网再看一下这样的效果。我是使用jQuery...
2020-01-01 18:35:48
510
原创 如何在react项目中使用axios和mock数据
如何在react项目中使用axios和mock数据你好！我们在react项目中需要经常使用axios请求mock模拟数据，本文将简单粗暴介绍如何使用axios请求mock数据。各位看官您往下看。一、下载我们需要使用axios和mock模拟数据，首先我们需要先去下载。下载axios ：npm install --save axios下载mockjs ：npm install --save...
2019-12-28 11:33:23
1721
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人