- 博客(113)
- 收藏
- 关注
RSS订阅原创 使用Vue-draggable组件实现表格拖拽效果
1.安装组件npm install vuedraggable -S2.引入组件完整代码：helloWorld.vue<template> <div class="hello"> <el-button @click="getData()">加载数据</el-button> <table class="dataTabble" v-for="(item,id) in tableData" :key="id">
2021-01-25 16:05:22
2443
原创 vue项目中使用sortablejs实现拖拽表格
1.首先install一下sortablejsnpm install sortablejs --save2.引入import Sortable from "sortablejs";完整代码如下：HelloWorld.vue<template> <div class="hello"> <el-collapse v-model="activeNames"> <el-collapse-item :name="index
2021-01-25 15:26:29
2273
原创 微信小程序中实现一段文字当只有一行时居中显示，多行时左对齐
刚开始没有头绪，百度了一下都说用wx.createSelectorQuery()这个方法，但是尝试无果。后来突然想到一个办法，如下：其中.prompt的样式如下看下效果：
2020-11-11 14:51:30
3322
原创 微信小程序中实现获奖名单滚动播放
使用小程序的swiper组件<swiper class="swiperBox" vertical="true" autoplay="true" circular="true" interval="2000" display-multiple-items='1'> <block wx:for-index="index" wx:for='{{list}}'> <swiper-item> <view class='swiperItem'>
2020-10-19 15:21:49
1095
1
原创 fastadmin表格之自定义搜索
1.使用搜索模板 在对应的index.html页面最底部添加搜索模板（注意模板是添加在和table一个页面的HTML页面的最底部）将自定义的搜索内容即下边这段代码放在最底部<script id="countrySearch" type="text/html"> <!--form表单必须添加form-commsearch这个类--> <form action="" class="form-commonsearch form-horizontal"&g..
2020-10-13 16:12:49
4025
原创 为date类型的input设置默认值为当前时间
<input type="date" id="date" placeholder="请选择日期"/> $(document).ready(function () { var date= new Date(); var day = ("0" + date.getDate()).slice(-2); var month = ("0" + (date.getMonth() + 1)).slice(-2); var today= d.
2020-10-10 17:13:51
3306
原创 fastadmin中使用phpExcel导出表格数据到excel中
虽然说fastadmin中表格自带导出excel，但是那个东西忒不好用了，每次点击导出，就刷新表格，默认最近七天的数据，所以无奈之下只好另寻办法了，废话不多说，接下来说一下phpExcel的使用：一，下载phpExcelgit clone https://github.com/PHPOffice/PHPExcel完成之后会出现以下以下的文件夹这个被更名的文件夹内部目录如下：二，把上图圈住的那个PHPExcel文件夹拷贝到你的项目中三，在你的控制器中添加导出方法...
2020-10-10 17:10:32
2580
原创 微信小程序setData赋值失败
原因是this.setData赋值代码中的最后一行nextVipName，index值是4，但是data的长度是5，所以下标为index+1的data[index+1]是不存在的，所以出现了setData赋值失败问题。修改一下就ok了：
2020-10-09 15:48:04
2064
原创 垂直水平居中布局的几种方法
第一种：绝对定位 + margin负值<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>垂直水平居中</title> <style> .parent{ width: 400px; height: 400px; margi
2020-09-25 14:06:58
339
原创 微信小程序返回上级页面并携带参数
我是从收货地址页面（addres.js）跳转到添加收货地址页面（addAddress.js），然后在这个页面点击获取微信地址，当跳转到你微信的地址页面后，点击完成，就直接跳转到地址页面，并将微信的收货地址展示在地址页面上看一下我两个console的打印结果...
2020-09-18 14:00:11
829
原创 微信小程序开发之嵌套循环
要实现这样的效果，因为我会员的等级信息是在一个数组里边，而商品信息是在另一个数组里边，他们之间通过会员id进行联系（即通过会员等级id可以请求到该等级下对应的商品信息）。数据结构：会员等级数据：商品数据：我想渲染到页面的话，就必须构造出一个数组，数组的结构如下：我的具体实现：wxml部分：...
2020-09-16 16:28:57
1311
原创 微信小程序开发之实现收货地址中标签效果
效果：主要思路就是：给每一个span设置一个data属性，通过点击事件获取这个属性值，并将其赋给activeItemIndex，然后在每一项通过判断activeItemIndex与固定值的比较，来切换不同的classwxml：wxss：js：...
2020-09-16 16:08:26
577
原创 移动端图片充满整个屏幕
问题是这样的，我一个抽奖页面，整个页面的背景是一张图片，但是上边的内容超出了屏幕，需要滚动（如下图）我刚开始一直不知道咋让屏幕滚动的情况下，让图片一直延伸来充满屏幕，然后脑子就像卡住了一样，但是今天突然想到，我为啥非要让图片也滚动呢？？？？那么，图片固定，内容滚动不一样可以实现？好了，解决这个问题，代码如下：...
2020-09-15 10:10:04
595
2
原创 微信小程序中页面间使用对象传参
当我们传入的参数过多，就可以传入一个对象在wxml页面使用data-**的方式传入一个参数js中将对象转化成json字符串在将要使用的页面的js中，再次将json字符串转换成json对象
2020-09-14 16:21:46
517
原创 css实现成长值类似的进度条效果
效果：代码：<view> <view class="levelGrow"> <view class="progress"></view> </view> <view class="inner"> <view>{{level}}</view> <view>成长值{{growth}}/{{nextGrowth}}</view>
2020-09-07 17:42:51
339
原创 微信小程序使用Vant Weapp中的Toast
首先在app.json或index.json中引入组件"usingComponents": { "van-toast": "@vant/weapp/toast/index" }然后再.wxml文件中写入：最后在js文件中，注意一定要注意路径，我就在这路径这里搞了半天
2020-08-31 10:41:13
6310
原创 js将秒数，毫秒数转换成时间串
/** * 将秒数转换成：某年某月某日 00:00:00 格式的时间串 */ formatDate:function(date){ //date是秒数 var d = new Date(date*1000), month = '' + (d.getMonth() + 1), day = '' + d.getDate(), year = d.getFullYear(), hour = d.getHours(), minute = d.getMinu.
2020-08-26 14:50:20
875
原创 微信小程序上拉加载和下拉刷新
上拉加载注意容器高度不要设置100%，且onReachBottom在页面生成时就有，注意不用自己写，否则会有覆盖的可能，导致上拉加载没有效果，在json配置文件中可以配置距离底部距离"onReachBottomDistance":10,Page({ /** * 页面的初始数据 */ data: { codeId:'', currentPage:1, pages:0, limit:10, list:[] }, /** ..
2020-08-26 10:42:13
195
原创 css实现圆圈进度
参考文章链接：https://my.oschina.net/conqueror/blog/727713，在自己的需求上做了一下改变。效果图：html：<div class="circle col-md-2" style="background: #91DBF2;"> <div class="pie_left"><div class="left" style="background: #23B7E5;"></div></div&.
2020-08-18 11:17:16
743
原创 input实现下拉模糊搜索
参考原博客地址：https://blog.csdn.net/qq_36337754/article/details/94160313根据自己的需求，做了一些调整htmlcssjs
2020-08-17 10:35:36
827
原创 Git删除本地分支以及重新拉取远程分支到本地
一.删除本地分支我要删除本地分支dev1.首先切换到本地一个其他的分支，这里我切换到本地mastergit checkout master2.删除本地分支devgit branch -D dev二.重新拉取远程分支dev到本地1.还是在master分支下进行操作，拉取远程分支dev到本地git fetch origin dev2.还是在master分支下进行操作，在本地新建dev分支git checkout -b dev origin/dev3.切换到本地dev分
2020-07-22 10:03:24
15026
转载 apiCloud中使用vue.js进行开发
https://blog.csdn.net/GeekAaron/article/details/102519193
2020-06-05 10:28:01
697
原创 vue在父组件中获取子组件的数据
刚开始使用this.$emit事件，但是子组件没办法触发事件，所以使用这种方法无法获取子组件的数据。今天偶然发现，原来可以直接使用下边的方法获取，简单好用这是我的子组件：父组件：使用：效果：总结：即在调用子组件的时候定义一个ref，然后使用this.$refs.child.属性...
2020-06-02 16:21:07
4947
原创 html页面使用vue进行单页面开发，封装组件以及父子组件传值
一.首先在html页面中引入vue.js二.由于多个页面用到相同的vant中相同的组件cell，所以写一个公共的组件，如下：子组件：父组件：效果:
2020-05-25 13:51:45
2929
2
原创 openlayers测距和测面积
初次使用openlayers地图进行开发各种地图功能，测距和测面积使用的是官方例子并进行了一些简单的修改，官方示例在测量一次之后不能停止，修改后，每点击测量，只会测量一次。js文件：measure.jsimport Draw from 'ol/interaction/Draw'import VectorSource from 'ol/source/Vector';import VectorLayer from 'ol/layer/Vector';import TileLayer fro.
2020-05-15 09:22:06
4552
4
原创 vue-element-admin项目中收缩中间栏
实现效果，就是中间left-content可以收缩，使右侧地图可以最大化显示（left-content和right-content的父元素为about-content）在父元素上写一个小按钮，点击利用display:none ;diaplay:block;隐藏显示left-contentdata部分：methods部分：...
2020-03-27 17:33:57
721
原创 vue-element-admin中根据主体颜色动态改变图标颜色
首先必须使用svg图像的icon框架已经封装好了，我们只需要在使用的地方引入icon图标，具体操作：1，将你的svg图像放入以下文件夹2. 在使用的地方引入你的图标，其中icon-class是你的svg的名称basecolor是主题色彩最后，需要注意一点，如果你的UI给到你的svg本身带有颜色，那么是改不了颜色的，需要将你的svg上传到iconfont（阿...
2020-03-26 16:07:35
2278
原创 vue项目头部路由，侧边栏路由联动问题
菜单效果：头部四个大的菜单，点击头部每个菜单，对应切换左侧菜单栏，点击浏览器刷新，刷新页面的同时保持各个菜单的状态不变头部四个菜单layout/index.vue：data部分：data() { return { index: '1', //默认进去为首页 //activeIndex2: '1', }},计算属性部分：compu...
2020-03-26 10:35:55
6472
4
原创 vue项目使用swiper
首先：npm install swiper vue-awesome-swiper --save其次在main.js中全局引入：import VueAwesomeSwiper from 'vue-awesome-swiper'// import styleimport 'swiper/css/swiper.css'Vue.use(VueAwesomeSwiper)在文...
2020-03-25 13:40:11
499
原创 导出图片到word文档
一：安装环境npm install mhtml-to-word二：在文件中引入三：详细使用exportWord(){ let that = this; var val = that.selectionList; val.forEach(item=>{ if(item.type == 0){...
2020-03-06 10:37:25
374
原创 git新建分支
有两种方法，第一种就是在码云上新建分支，然后拉取到本地1.首选在码云上创建新的分支2.在本地项目目录下git pull拉取到本地3.切换分支：git checkout 分支名 git branch -a (查看所有分支) ...
2020-03-04 09:33:43
112
原创 mapbox聚合，根据不同状态展示不同图标
首选聚合的话，大家可以参考官方的这个例子：根据不同状态显示不同图标，比如我的项目需求是根据在线，离线状态，分别图标为绿色图标和红色图标：可参考官方文档中的这个例子：根据以下代码和表达式语法，结合自己的需求写自己的代码表达式语法：以下是我的详细代码 ;以下是聚合函数代码：效果图：其中，自定义图片的引入代码如下（一条龙哈哈）：...
2020-02-25 18:58:31
4569
3
原创 vue项目+element表格前端使用纯js导出word文档
详细请读https://www.jianshu.com/p/0de31429b12a这篇文章首先安装各种工具：-- 安装 docxtemplatercnpm install docxtemplater pizzip --save-- 安装 jszip-utilscnpm install jszip-utils --save -- 安装 jszipcnpm instal...
2019-12-24 15:42:13
2517
原创 vue+element表格实现图片展示，点击图片在屏幕中央放大显示
后台返回的字段是photo1和photo2，是目录名、图片名的形式，前台想要展示出来还拼接域名。前台html和数据放大展示：方法：
2019-12-24 14:59:11
2544
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人