加载中
vue页面采用原生方式拖动

主要的难点是怎么获取要拖动的元素,e.target是获取的目标元素,可以采用while循环 var el = e.target while(el && el.classList && !el.classList.contains("drag")){ el = el.parentN......

09/30 14:24
19
vue拖动通过指令方式

可以在组件上设置指令也可以设置全局指令 目标 1、移动元素并保存位置信息 主要用到 onmousedown onmousemove onmouseup 在组件中设置指令 directives: { drag: { inserted(el, binding) { ...

09/30 14:19
20
高德地图悬浮在marker上显示文字

主要用到 mouseover 和 mouseout 方法 <div id="GDMap" style="height: calc(100vh - 200px)"></div> showMap() { loadMap(this.key, this.plugins, this.v) .then((AMap) => { ......

09/24 15:37
140
高德地图上放多个视频,并有切换按钮

难点是地图上标签里面的按钮怎么与vue事件结合,可以通过显示marker的时候执行一个vue事件,在vue事件中通过事件委托的方式绑定事件 完整代码 <template> <div> <div id="GDMap" style="heig...

09/17 15:56
13
highcharts 点击事件用法

<template> <div> {{pointerValue}} <highcharts :options="chartOptions" :callback="myCallback"></highcharts> </div> </template> <script> export default { name: "HelloWorld", ......

08/27 17:36
15
vue cli3 引入外部字体

如果ps设计稿的字体在网页中没有对应的字体显示,要想跟设计稿效果一致 要引入外部字体 一、 C盘window下的font 文件夹中找到需要的字体,复制到自己的文件中 在font.css中写样式 @font-face...

photo-sphere-viewer的使用

展示点的信息比threejs方便 首先安装 photo-sphere-viewer npm install photo-sphere-viewer 直接贴代码, <template> <div style="overflow:hidden;border:1px solid #ccc"> photeSphereVi...

npm
08/23 18:56
31
openlayer 点击标记点

我用的版本是"openlayers": "^4.6.5",首先在Feature设置ID,便于获取这个标记点的信息 iconFeature.set("Id",item.id) if(this.PointsLayer.length){ console.log("you") ......

08/22 13:50
80
vue页面批量注册组件

一般情况下我们是 import A from A.vue,如果组件特别多的情况就比较麻烦,可以通过reqire.content批量注册组件 require.context函数接受三个参数 directory {String} -读取文件的路径 useSub...

08/14 17:50
25
vue 页面拼接的html onclick事件的使用

假如在地图的label 上有个按钮,如何触发点击事件 注意:函数动态参数外面要加个引号(下面的转义单引号),否则不能正确传递参数 let stationSerial = "s001" let labelContent='<div styl...

07/24 10:19
145
js模板字符串中使用循环遍历数据

模板字符串可以嵌入变量, 模板字符串使用反引号 (` `) 来代替普通字符串中的用双引号和单引号。模板字符串可以包含特定语法(${expression})的占位符。我们经常用的是`my name is ${name}...

07/24 09:59
1.2K
vue-echarts的用法

原生的Echarts需要定义id,有时候不方便,对于习惯了数据驱动可以使用vue-echarts npm installl vue-echarts --save 这样会安装6.0以上的版本,6.0的版本是基于vue 3.0,如果我们现在正使用的...

倒计时

getResendInf(){ if(this.reSendTime>0){ this.reSendTime-- console.log(this.reSendTime) this.phoneBtnInf = this.reSendTime+"秒后重新发送" setTimeout(()......

06/06 10:23
39
Vue.extend注册组件的用法

官网的介绍 参数: {Object} options 用法: 使用基础 Vue 构造器,创建一个“子类”。参数是一个包含组件选项的对象。 data 选项是特例,需要注意 - 在 Vue.extend() 中它必须是函数 <div i...

05/30 14:34
98
设置html 根元素字体

rem 字体是根据html的字体有关的,如html的字体是60px 1rem就是60px,根据屏幕不同设置html不同的字体大小,有2种方式 1、媒体查询 @media (min-width:400px) and (max-width:900px) { html{...

05/30 10:56
130
vue组件另一种传值

我们经常用的组件传值 1、父子组件props传值 2、vuex 如果有2个动态组件,一个是视图一个是参数配置,修改参数配置视图更新,这种情况可以使用父组件触发子组件事件,把对象数据传过去 一个页...

05/23 08:11
35
vue 拖动

需求:有2个模板,可以切换模板,组件拖动到一个模板中并预览页面,左边是组件列表,右边是可选择的模板 需要有几个vue 页面 1、home.vue <template> <div class="container"> <div @dragsta...

05/15 15:27
23
高德地图信息框作为组件

信息框如果用html拼接字符串的方式来实现,感觉比较麻烦,下面是使用组件的方式来实现。 组件:mapInfoCom.vue <template> <div> <el-button>{{id}}btn</el-button> <el-card class="box-ca...

04/24 18:15
12
在el-table上使用无限滚动加载

一、安装插件 npm install --save el-table-infinite-scroll 二、全局引用 import Vue from 'vue'; import elTableInfiniteScroll from 'el-table-infinite-scroll'; Vue.use(elTableInfini...

vue滑动插件 vue-drag-verify

一、插件的安装 : npm install vue-drag-verify --save 二、安装字体图标 font-awesome npm install font-awesome --save 三、使用方法 <drag-verify :width="width" :height="hei......

04/04 12:53
2.7K

没有更多内容

加载失败,请刷新页面

返回顶部
顶部