- 博客(23)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 百度地图行政区域划分镂空
<!DOCTYPE html><html><head> <meta charset="utf-8"> <title></title> <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=密钥"></script> <script type="text/javascript" src.
2022-02-11 15:52:54
737
原创 vue+vue-awesome-swiper一款非常方便的轮播图
下载依赖：cnpm install --savevue-awesome-swiper在需要使用的界面引入即可vue-awesome-swiper地址：vue-awesome-swiper示例：<template> <swiper class="swiper" :options="swiperOption"> <template v-for="(item,index) in carouselData"> <swiper-sl.
2022-02-11 15:27:31
540
原创 vue+mysql实现前端对接数据库
下载引入相关依赖1、cnpm install --save mysql2、cnpm install --save axios3、cnpm install --save body-parser4、cnpm install --save express5、cnpm install --savecrypto在main中引入axiosimport Axios from 'axios'Vue.prototype.$axios = axios配置连接在src下新建文件夹se.
2022-02-11 14:44:53
30348
9
原创 vue+vue-baidu-map（百度地图）实现点击地图标注地理信息并获取经纬度坐标或拖拽图标获取地理坐标信息
1、实现需求小程序中需要使用到地图导航定位，所以在客户端填写基础信息时需要填写详细地址，同时得到经纬度坐标，从而实现地图导航。1.1 实现方式一根据用户选择的省、市、县（区）以及输入的详细地址信息，通过百度官方提供的地址编码解析从而得到地址经纬度坐标。先下载vue-jsonp： npm(cnpm) install --save vue-jsonp在main中引入：import * as VueJsonp from 'vue-jsonp (这里注意 加上” * as “) Vue.p
2022-02-10 17:46:45
6635
1
原创 vue+element+dialog实现弹窗可拖动
新建dialog.js文件，并在main.js中引用（全局），也可以在使用的地方局部引用dialog.js代码内容import Vue from 'vue'// v-dialogDrag: 弹窗拖拽Vue.directive('dialogDrag', { bind(el, binding, vnode, oldVnode) { const dialogHeaderEl = el.querySelector('.el-dialog__header') const dragDom
2021-08-06 11:17:56
318
原创 vue实现图片通过鼠标滚轮放大缩小，并且能够拖动
<template> <!-- 实现鼠标缩放图片并拖拽功能 --> <div class="box" id="bigimg" @mousewheel="bbimg($event)"> <img id="img" border="0" src="../../static/img/bg.jpg"> </div></template><script> export default { data
2021-08-06 10:56:32
2782
1
原创 前端知识点记录
这里写自定义目录标题前端知识点记录CSS相关知识点px、em、rem区别介绍html相关知识点js相关知识点其它前端知识点记录以希望养生的人，会绝望而死。—— 富兰克林当一个人用工作去迎接光明，光明很快就会来照耀着他。CSS相关知识点px、em、rem区别介绍1、px像素，相对长度单位，像素px是相对于显示器屏幕分辨率而言。特点： 1、IE无法调整那些使用px作为单位的字体大小2、国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位；3、Firefox能够调整px和em，re
2021-07-13 17:19:39
147
原创 vue3.x创建项目
一、安装Vue-cli 1、运行终端 vue -V 或者 vue --version 确认自己 vue 版本在3.x以上 2、如果vue版本在3.x跳过下面步骤，低于3.x版本的执行下面步骤 2.1、没有返回版本信息，提示指令“不是内部或外部命令”的直接执行下面的安装指令# npm 安装确保自己安装了node并配置了环境 # 可以终端npm -v 验证，以及node -v 验证npm install -g @vue/cli#或者 c...
2021-05-27 10:00:23
139
原创 vue之关于HTML5拖放（drag）
简单拖放可参考w3schoo中H5拖放教程可实现将某部分元素拖放至指定元素内。主要记录下拖放实现位置互换使用html文本文件的可参考：https://www.cnblogs.com/shemingxin/p/13519799.html主要记录下vue实现H5的拖放位置互换，虽然有些组件可实现，但样式调整修改不易。下面简单例子记录下拖放的实现代码部分及简单样式<template> <div class="hello"> <el-row :gu
2021-01-22 11:13:34
852
原创 vue+vant移动端上传upload
1、首先下载依赖# Vue 2 项目，安装 Vant 2.x 版本： npm i vant -S# Vue 3 项目，安装 Vant 3.x 版本： npm i vant@next -S2、全局或者自己局部引用（依据自己需求而定）3、这里使用局部引入组件import { Uploader } from 'vant';<template>//直接使用<van-uploader :after-read="afterRead" />//在表单中使用
2020-12-09 15:18:47
1609
原创 vue 计算结束日期与当前时间相差天数
添加下面方法即可//创建方法erDateDiffer(Date_end){ //date1结束时间 let date1 = new Date(Date_end); //date2当前时间 let date2 = new Date(); date1 = new Date(date1.getFullYear(), date1.getMonth(), date1.getDate()); date2 = new Date(date2.getFullYear(), dat.
2020-11-23 09:44:25
5848
原创 vue引用echarts
在vue中使用echarts一般都是直接npm install echarts -S下载然后全局或者局部引用。在我资源中有一个文件，可以局部引用简化我们使用echarts首先创建一个新项目写下使用过程将文件复制到依赖中解压里面有两个文件在vue-echarts-v3中有一个src目录下有一个full.vue文件代码中的用法，直接引用那个文件即可，mix中的内...
2018-10-17 15:23:23
2761
原创 第三章——vue、d3进阶之完整的柱状图
1、效果图，图中有数据值，x轴坐标,y轴轴2、代码<template> <div id="mydiv"> <!-- <svg> <rect></rect> </svg> --> </div></temp
2018-08-30 14:43:08
1485
原创 第二章——vue、d3进阶之第一个图表
1、柱形图表效果代码：<template> <div id="mydiv"> <svg> <rect></rect> </svg> </div></template><script>i
2018-08-29 18:47:09
1066
原创 第一章——vue、d3进阶
一、新建一个vue项目，安装d3.js这个网上资源都有，就不写详细了，自己搜吧。二、vue、d3的第一个demo了解大d3和javascript修改p标签内容的不同用法。<template> <div> <p>hello world1</p> <p>hello world2</p> &...
2018-08-29 10:58:34
2434
原创 vue知识之截取字符串
在后端有许多的封装方法来截取字符串或者对字符串的操作，同样前端也有相应的方法。有一个data数据为ipaddrdata() { return { ipaddr: "192.168.100.110", }; },1、现在需要切割成一个数组，得到四个ip值,只需要通过计算属性就可以实现computed：{ ip...
2018-08-13 16:57:11
60261
1
原创 HTML样式布局css属性之position定位
属性：position（定位）上图是官方的介绍，在实际使用的时候可以通过提示看到还有许多的值可选，例如：-ms-page、-ms-device-fixed、-webkit-sticky、initial、sticky、unset等。1、fixed(英译：固定的)：在官方的介绍中其位置是相对于浏览器窗口来定位的。注意的是当你在元素中使用了该值来定位，它的位置使用left、top、right...
2018-08-10 18:34:12
1425
原创 父/子组件传值
父组件向子组件传值首先先创建两个组件一个作为父组件，一个作为子组件。创建两个组件一个是text.vue一个是demo.vue。（至于没有用father /son 以及 parent/child 这些名字是因为之前自己把子父组件也给弄混淆了。注：子组件是包含在父组件之中的）demo.vue为父组件<template> <div class="demo"&g...
2018-08-09 18:31:27
262
原创 vue进阶之vue-easytable实现前端的表格+分页
表格+分页对于还在坑中的自己而言，勤奋的笔记不能停。还是在博客上多记录免得文件丢失到时不知哪里找。网上虽然有许多分页内容，但是对初学者而言有许多不必要的东西容易搞混阅读者。所以自己弄了一个简单纯净版的，没有过多的修饰内容。分页部分可以使用elementui中的，也可以直接用vue-easytable中的，两者一样的，没啥区别。第一步：引入vue-easytable（这个网上有许多的资料...
2018-08-08 09:41:18
17723
4
原创 vue+element 实现上传（upload）和下载（download）
最近自己摸索了一下elementui ,学了点东西总结记录分享一下element中文官网上有upload的文档内容，虽然不多，但还是可以用的：http://element-cn.eleme.io/#/zh-CN/component/upload但好像没有看到下载的内容，就自己去找了一波。下面两张图是效果图。简单点直接附上代码<template> &l...
2018-07-31 15:13:48
34658
3
原创 Vue入门知识（1）
在尚未搭建环境时，可以先简单了解一下vue.js。CDN引入vue<script src="https://unpkg.com/vue"></script>使用编辑器创建一个index.html和一个app.js文件index.html内容<!DOCTYPE html><html> <head> <..
2018-07-17 16:18:49
147
原创 Vue初识
1、vue.js网址：https://cn.vuejs.org/2、vue.js 一个渐进式的javascript框架：优点什么的易用、灵活、高效就没必要讲了。3、介绍什么的自己去看。4、直接讲如何使用，使用有3个方法：（1）下载js引用，（2）CDN引用，（3）NPM安装使用 （1）下载使用，在官网上下载，如图有两种，一种是开发版本，一种是生产版本。 ...
2018-07-17 15:34:14
159
原创 java基本数据类型
一、java八大基本数据类型：byte、short、 int、 long、 double、 float、 char、boolean二、详解1、整数类型 声明定义格式： byte b=2; short s=10; int i=100; long l=1000; 注意：如果long定义数值超过int的数值范围在后面加"L...
2018-07-17 10:32:54
143
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人