- 博客(21)
- 收藏
- 关注
RSS订阅原创 vue高德地图API使用介绍,实现搜所标点功能
效果图功能实现:搜所查询标点,及标记拖拽事件1.安装插件API链接: https://developer.amap.com/api/javascript-api/reference/mapimport VueAMap from 'vue-amap'Vue.use(VueAMap);VueAMap.initAMapApiLoader({ key: '你的key',//在官网注册个key //所需插件 plugin: [ 'AMap.PlaceSearch','AMap.A
2021-02-23 17:24:59
640
原创 JavaScript原生动态切换tab样式
<style> .box { display: flex; width: 500px; justify-content: space-between; border: 1px solid darkgray; align-items: center; height: 60px; } .box div { text-align: center; } .
2021-01-26 10:03:27
367
原创 JSON.parse解析空串报错“SyntaxError: Unexpected end of JSON input“
报错！需要使用JSON.stringify对空串进行转换后才不报错console.log(JSON.parse(''))
2021-01-04 14:38:43
1590
原创 vue-router的$route.replace使用及未生效原因
replace 与push的区别在于,replace的跳转的页面不会被记录路由记录中,在使用$route.go(),更方便!在使用replace未生效的原因:(1) replace是作用在本页的路由的(例如从home页跳转到index页,使用了$route.replace(’/index’),那么home页将不会记录在路由历史中!!!)...
2020-12-24 14:57:24
11740
原创 vue循环标签ref的值重复问题,获取ref为undefined
ref值重复,如何获取对应标签或组件正常使用vue 的 ref属性时使用$refs获取返回的是一个对象,对象包含组件内部信息.(例如 method中方法,及data中数据) //gauge 组件内部定义了个方法fun; <gauge :dataSource="arr" ref="gauge"/>//组件 this.$refs.gauge.fun();//通过$refs可以直接调用组件内部方法循环显示组件 ,导致ref ,重复,按照第一种方
2020-11-20 11:41:29
6664
3
原创 vue 定时器功能的实现 格式 00:00
通过判断各个变量的数值,进行秒转换为分钟,限时5分钟 <div> <span>{{dozensMin}}</span>//秒 <span>{{min}}</span> <span>:</span> <span>{{dozensSecond}}</span>
2020-11-13 18:02:55
477
原创 已知数组添加可被vue监听的属性 vue
有时再获取一个已有数据的对象或者数组时,仍需要为其添加所需的属性,需要使用$set方法进行添加,这样添加后的属性是可以被vue监听到的. return { list: [],//数组 } methods:{ setAttribute(){ for (let i = 0; i < _this.list.length; i++)
2020-11-13 17:05:34
300
原创 margin-top传递的问题
margin重叠1、block元素2、垂直方向解决办法:给父元素添加border使用padding代替margin设置子元素为行内块元素 display: inline-block;开启元素的BFC(开启方法百度)
2020-11-07 14:20:02
488
原创 vue 动画的使用
将要设置动画的标签,放进transition标签内,给个name属性,module-enter-active :标签进入的动画(就是show=true 时的动画效果)此动画是从组件的高度0px,一直致最大高度的动画. //html <transition name="module"> <interval-random v-if="show" :type="type" @close="close"/>//组件 &l
2020-10-29 17:56:16
222
原创 vue 动态引入本地图片方法
直接使用 require(’…/…/…/assets/img/ie_bottom_data.png’)的方法引入图片.如果直接设置为 img: ‘…/…/…/assets/img/ie_bottom_data.png’ 会找不到该图片 <div v-for="(item,index) in navList" :key="index"> <img :src="item.img" @click="navClick(item)">
2020-10-26 16:20:44
888
原创 定位元素垂直居中,水平居中
<style> .father{ width:100%; height:200px; position: relative; } .son{ position: absolute; top: 50%; //距离父元素高度 right:50%; //距离父元素右边的距离 transform: translateY(-50%); //垂直居中,向上移动自身..
2020-10-15 16:26:52
1578
原创 Object.create()方法的使用
Object.create创建一个新的对象,将现有对象作为新对象的__proto__.参数1:作为__proto__的对象参数2: 类型为Object,可以为新对象添加属性 let obj = { name: 'sss', age: 12 } const me = Object.create(obj); //返回一个新的空对象 ,并将现有对象作为新对象__proto__
2020-10-12 16:28:46
828
原创 对象的深拷贝和浅拷贝多种方法的总结
let obj={ name:'xswl', age:18, fun:function () { return this.name; } }; let obj2 = obj; obj2.name='js'; console.lo...
2020-10-12 10:48:10
217
原创 移动端触摸事件(touchstart,touchend,touchmove)的使用!
touchstart 开始触摸 touchmove 移动时触 touchmove 结束时触发触摸事件有三个属性对象,touches对象 :表示当前触摸的手指个数,此对象中还包括集合clientX:clientY: 距离距离浏览器内容左上角的距离,screenX: screenY: 距离电脑窗口的距离pageX:pageY: 当前页面的距离包括滚动条距离changedTouches 记录发生改变的触摸点集合targetTouches 没有离开的触摸点集合示例
2020-10-10 17:53:23
1473
原创 数组乱序,真乱序和伪乱序
伪乱序通过数组的sort方法重新排序 let arr = [1, 3, 4, 9, 6, 8, 5, 2, 7] change(arr) { arr.sort(() => { return Math.random() > 0.5 ? 1 : -1; }); return arr; }
2020-09-30 12:04:29
202
原创 Echart绘制折线图,隐藏纵坐标
效果图如下:refreshDraw()方法保证,数据改变后,重新绘制折线图,否则不会刷新数据 methods: { getEchartData() { let eChart = this.$echarts.init(document.getElementById('eChart')); eChart.setOption({ legend: {show: true},
2020-09-24 17:57:52
3008
原创 vue使用定时器修改数据,页面未刷新!
今天在vue中使用定时器,修改data中的数据,页面不改变代码是这样的commonClick(index) { setTimeout(function () { this.count = this.count - 1; this.show = !this.show; }, 200); },修改this指向后,页面更新,**注意vue中this的指向问题!!!**萌新一个,哪里有问题
2020-09-17 16:41:50
1998
1
原创 vue 不能监听对象属性的改变
vue 不能监听对象属性的改变 需要重新赋值后才会渲染页面! <div v-for="(item,index) in commonList" :key="index" :class="active[index] ? 'activeClass' : 'noClass'" @click="commonClick(index)"> {{item}} </div>//方法commonClick(i
2020-09-17 12:55:39
957
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人