- 博客(79)
- 收藏
- 关注
转载 vue拖拽组件(app移动端)
vue拖拽组件<template> <div id="webId"> <!-- 1.1 如果碰到滑动问题,请检查这里是否属于同一点。 --> <!-- 悬浮的HTML --> <div class="xuanfu" id="moveDiv" @mousedown="down()"
2022-04-06 11:38:47 1091 1
原创 node中req.params,req.query,req.body
req.params由nodejs默认提供,无需载入其他中间件。nodejs中动态获取参数,一般是get请求,不改变地址,在前端异步调用接口传参数用的app.get("/api/:keyWord",(req,res)=>{ console.log(req.params.keyWord) res.send("发送成功")})req.query由nodejs默认提供,无需载入中间件,此方法多适用于GET请求,解析GET请求中的参数,包含在路由中每个查询字符串参数属性的对象,如果
2022-03-07 17:51:19 953
原创 vue移动端
移动端实现如下图竖线加上下边框<div class="layer"> <div class="layer-header"></div></div>/*样式代码*/.layer{ width: 100%; background: #fff;}.layer-header{ height: 30px; position: relative; padding:0 10px;}.layer-header::before
2022-02-17 15:46:06 476
原创 移动端1像素边框问题
移动端1像素边框问题.contianer{ position: relative; &::before{ content:" "; position: absolute; left:0; top:0; width:200%; height:200%; transform:scale(0.5,0.5); transform-origin:left top; border:1px solid lightgray; box-sizing:border-box;
2022-02-16 17:23:10 400
原创 vue中粘贴板clipboard的使用方法
安装clipboard : npm install clipboard --save在模板文件中引入: import Clipboard from “clipboard”具体使用: (这里我用的表格) <el-table :data="gridData" border> <el-table-column prop="documentPath" property="date" label="文件位置"
2022-02-14 10:41:32 10332
原创 border-image-source使用
border-image-source使用注:使用border-image-source属性必须给容器添加border属性<style> .box{ width: 300px; height: 200px; border: 27px solid #aaa; /*必须有这个属性*/ background-color: #07a; border-image-source: url(../image/border-icon.png); borde
2022-02-07 14:57:33 1498
原创 git 回退指定版本
git log该命令显示从最近到最远的提交日志。每一次提交都有对应的 commit id 和 commit message。(找到需要回退的版本id)git reset --hard id该命令根据 id 回退到指定的版本git push推送到本地到远程仓库:让远程仓库代码和你本地代码一样...
2022-01-21 17:01:16 2120
原创 前端生成id方法
前端生成id方法generateId() { const s = [] const hexDigits = '0123456789abcdef' for (let i = 0; i < 36; i++) { s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1) } s[14] = '4' s[19] = hexDigits.substr((s[1
2021-12-29 16:38:09 1651
原创 js判断开始时间不能小于结束时间
js判断开始时间不能小于结束时间function validTime(startTime,endTime){ var arr1 = startTime.split("-"); var arr2 = endTime.split("-"); var date1=new Date(parseInt(arr1[0]),parseInt(arr1[1])-1,parseInt(arr1[2]),0,0,0); var date2=new Date(pars
2021-12-29 16:35:19 1224
原创 vue 项目表格(el-table)列表添加序号
vue 项目表格列表添加序号第一种<template slot-scope="scope"> {{ scope.$index + 1}}</template>此方法在切换页码时,还是1,2,…10第二种:结合页码+条数<template slot-scope="scope"> {{ (page - 1)*pageSize+scope.$index+1 }}</template>//page:页码//pageSize:一页显示的条数
2021-11-01 16:55:15 6098
原创 2021-11-01
vue项目 pc端下载功能前端请求后端接口,返回文件流//点击下载,拿到下载的文件流let data = res;//res==》请求接口拿到的文件流 /* 兼容ie内核,360浏览器的兼容模式 */ if (window.navigator && window.navigator.msSaveOrOpenBlob) { const blob = new Blob([data ], {type: "application/vnd.ms-excel;
2021-11-01 15:04:07 118
原创 Object.hasOwnProperty()方法使用
Object.hasOwnProperty()方法使用官方解释:hasOwnProperty() 方法会返回一个布尔值,指示对象自身属性中是否具有指定的属性(也就是,是否有指定的键)具体使用:let obj = { color:red, name:tom, age:10}obj.hasOwnProperty('age'); //在控制台输出trueobj.hasOwnProperty('eating'); //在控制台输出falselet obj1 = { name:null,
2021-08-10 15:44:24 1050
原创 js获取年份,当前年份的前后15年
js获取年份,当前年份的前后15年<template> <div> <el-select v-model="year" placeholder="选择年份" size="small" clearable > <el-option v-for="(item, i) in years" :label="item.label"
2021-08-04 09:44:18 3382 1
原创 css实现月份当月高亮,当月之后的置灰,当月之前的点击高亮
css实现月份当月高亮,当月之后的置灰,当月之前的点击高亮话不多说直接上代码:<template> <div class="month_box"> <div v-for="i in 12" :class="{'month_active':form.monthNum==''?form.month==i:form.monthNum == i && form.monthNum<=form.month,'month_active_next':form.m
2021-07-06 16:48:44 184
原创 js 获取每个月的最后一天
js 获取每个月的最后一天getDate() {//获取每个月的最后一天 let d = new Date(); let y = d.getFullYear();//获取年份 let m = d.getMonth() + 1;//获取月份 let dateStr = y + '-' + m; //需要获取此月最后一天的日期 let dateObj = new Date(dateStr); let nextMonth = dateObj
2021-07-01 14:15:01 2189
原创 pc端侧边菜单封装组件(使用element-ui组件库中el-menu组件)
pc端侧边菜单封装组件使用布局容器组件布局<el-container> <!--头部组件--> <el-header>Header</el-header> <el-container> <!-- 侧边菜单组件 --> <el-aside :width="isShowMenu ? '64px !important' : '15% !important'"> <div cl
2021-06-28 14:40:53 544
原创 element-ui组件库中el-table表头和内容居中
element-ui组件库中el-table表头和内容居中表头水平居中<template> <el-table :data="tableData" style="width: 100%" :header-cell-style="{textAlign: 'center'}"> <el-table-column prop="date" label="日期"> </el-table-column>
2021-06-22 11:15:19 1076
原创 在项目中用vue-pdf实现在线预览
在项目中用vue-pdf实现在线预览首先我们下载vue-pdf依赖包:npm/cnpm i vue-pdf --save第二部:我们在模板文件中使用<template> <div id="remoteSignature-pages-videoAuthenticationDetails-videoAuthenticationDetails"> <pdf v-for="i in numPages" :key="i" :src="pdfSrc" :
2021-05-13 16:16:41 179
原创 将vue项目整个拷贝到U盘,拷贝后的项目运行后报错
将vue项目整个拷贝到U盘,拷贝后的项目运行后报错原因:下载的依赖包用cnpm i 下载,拷贝后node_modules中下载的依赖容易丢失,就会造成项目运行不起来解决办法:首先我们卸载依赖包:cnpm uninstall 依赖包的名字 例如:cnpm uninstall vue-pdf --save完成之后,我们在下载依赖包 cnpm install 依赖包的名字 --save下载之后我们在启动项目就可以了...
2021-05-13 15:05:58 972
原创 在项目中动态获取font-size的值
在项目中动态获取font-size的值在项目中创建一个rem.js文件,里面内容如下:(function (doc, win) { var docEl = doc.documentElement, resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize', recalc = function () { var clientWidth = docEl.clientWidth;
2021-02-19 14:03:57 612
原创 在项目中看到同事使用some方法
在项目中看到同事使用some方法看代码,同事用的some()方法,一开始没有反应过来,上度娘上百度下恍然大悟。some()方法some() 方法用于检测数组中的元素是否满足指定条件(函数提供)。some() 方法会依次执行数组的每个元素:如果有一个元素满足条件,则表达式返回true, 剩余的元素不会再执行检测。 如果没有满足条件的元素,则返回false。注意:some() 不会对空数组进行检测。注意:some() 不会改变原始数组。var age = [3, 10, ...
2021-02-18 17:37:02 101 2
原创 项目中隐藏滚动条
项目中隐藏滚动条body { max-width: 750px; min-width: 375px; margin: 0 auto; font: normal 14px/1.5 Tahoma, "Lucida Grande", Verdana, "Microsoft Yahei", STXihei, hei; color: #000; background: #fff; overflow: hidden; -webkit-tap-hi.
2021-02-09 14:07:21 60
原创 alert弹框去掉里面的网址
alert弹框去掉里面的网址 window.alert = function(name){ var iframe = document.createElement("IFRAME"); iframe.style.display="none"; iframe.setAttribute("src", 'data:text/plain,'); document.documentElement.appendChild(iframe); window.frames[0].
2021-02-07 15:37:09 1948 3
原创 vue项目中跳转页面后显示内容不在顶部
vue项目中跳转页面后显示内容不在顶部原因:在项目中使用了el-scrollbar组件,导致scrollTop始终为0解决办法:1、给el-scrollbar组件ref属性,ref=scrollTop2、监听$route3、在路由改变时执行this.$refs.scrollTop.wrap.scrollTop=0这样就解决了跳转路由后自动回到顶部...
2021-02-05 15:15:36 652
原创 使用element-ui组件库中el-cascader和el-select组件时,下拉项不随页面滚动走的解决办法
使用element-ui组件库中el-cascader和el-select组件时,下拉项不随页面滚动走的解决办法1、el-cascader组件,添加:append-to-body="false"<el-cascader v-model="buildForm.companyAddress" :options="areaList" :append-to-body="false" clearable style="width: 100%" >
2021-02-02 17:13:46 2452 1
原创 点击显示倒计时(点击发送验证码)
点击显示倒计时(点击发送验证码)<template> <div class="myorder_bg"> <van-field v-model="verificationCode" center required label="请输入验证码" placeholder="请输入验证码" > <bu
2021-02-01 16:06:05 78
原创 用vant组件库来实现发送验证码
用vant组件库来实现发送验证码话不多说,直接上代码<template> <div class="myorder_bg"> <van-field v-model="verificationCode" center required label="验证码" placeholder="请输入验证码" > <button slot="but
2021-01-26 10:53:40 1753
原创 在项目中使用npm run dev报错解决
使用npm run dev指令报错 错误是:Cannot find module 'core-js/modules/es6.regexp.constructor'出现这个错误 莫要慌张请在命令行中输入这个代码:cnpm install core-js@2
2020-12-28 22:15:38 286
原创 SVN管理工具
SVN(Subversion)是一个自由、开源的项目源代码版本控制工具。目前,绝大多数开源软件和企业代码管理,都使用SVN作为代码版本管理软件。Subversion将文件存放在中心版本库里,这个版本库很像一个普通的文件服务器。不同的是,它可以记录每一次文件和目录的修改情况,这样就可以在需要的回滚时,将数据恢复到以前的版本,并可以查看数据的更改细节。首先下载安装SVN:http://subversion.apache.org/常用的指令:svn add — 添加文件、...
2020-12-25 15:26:14 2974
原创 如何根据设计图设计rem比例
如何根据设计图设计rem比例关于图纸通常UI会给我们的设计图,设计图的宽度一般为750px(像素),也有设计图的宽度为640px具体操作我们主要就是根据上面的图纸宽度和手机可视窗口的宽度来设置rem比例众所周知,rem布局原理是由根元素的font-size值来决定的,通常:font-size=100px=1rem。这是怎么计算的呢?我们简单以750的设计图为例:我们可以设置一个js文件来处理rem,需要使用rem时调用即可function rem(){ //根据设备的宽设置h
2020-12-07 23:16:54 413
原创 混合app的使用
什么是混合AppHybrid App是指介于web-app(网页APP,如京东web)、native-app(原生应用,如手机上面的APP应用)这两者之间的app,它虽然看上去是一个Native App,但只有一个WebView ( WebView,可以类比成iframe ),里面访问的是一个Web App,就是包了个客户端的壳,其实里面是HTML5的网页。混合开发(HybridApp开发),是指在开发一款App产品的时候,为了提高效率、节省成本而利用原生与H5的开发技术的混合应用。通俗点来说,这就
2020-12-07 23:02:21 260
原创 说说你在项目中是怎么做微信支付,支付宝支付
业务场景介绍:H5移动端支持微信支付 [ 微信支付分为微信内支付(JSAPI支付官方API)和微信外支付(H5支付官方API)] && 支付宝支付[手机网站支付转 APP 支付 官方API ]订单生成逻辑:前端请求后端提交订单,后端去和微信或者支付宝对接生成订单(后续支付都是这个逻辑进行的对接)移动端微信支付,在vue中如何使用在移动端微信支付分为微信内支付和微信外支付。1.在订单组件中选择支付方式之后在支付页面先去判断是否是在微信内://判断是否微信 is_wei
2020-12-07 22:38:22 561
原创 谈谈对js单线程,宏任务微任务理解
谈谈对js单线程,宏任务微任务理解在前端的面试中经常会问到关于代码执行顺序的问题,我们先看下面一段代码:setTimeout( () => console.log(4))new Promise(resolve => { resolve() console.log(1)}).then( () => { console.log(3)})Promise.resolve(5).then(() => console.log(5))console.log(2
2020-12-07 22:09:28 83
原创 在uniApp开发中遇到的问题及解决的办法
1、tabbar导航栏问题在写项目的时候前期需求要求底部导航栏中间部分凸起,样式为一个蓝色的圈圈(发布按钮),而原生的uniapp不支持自定义底部导航栏,于是需要进行自定义修改。解决方法:在uniapp官网的插件市场中,根据别人写的插件,使用非原生的方式自行实现底部导航栏和页面跳转(此时pages.json对底部导航栏的功能将不再使用)。实现原理:将一个需要跳转的页面写成一个组件,当点击导航栏的时候,去判断自定义的底部导航栏index,不同的index,使不同的组件出现或消失。优点:可以方便的对底
2020-12-04 21:38:39 4087
原创 uniApp快速上手
uniApp是什么?官方解释:uni-app是一个使用Vue.js开发所有前端应用的框架,开发者编写一套代码,可发布到iOS、Android、Web(响应式)、以及各种小程序(微信/支付宝/百度/头条/QQ/钉钉/淘宝)、快应用等多个平台。uni-app在手,做啥都不愁。即使不跨端,uni-app也是更好的小程序开发框架、更好的App跨平台框架、更方便的H5开发框架。不管领导安排什么样的项目,你都可以快速交付,不需要转换开发思维、不需要更改开发习惯。注意:uni-app实现了一套代码,同时...
2020-12-04 21:22:01 841
原创 说一下小程序组件中如何进行通信
说一下微信小程序组件中如何进行通信1、父组件传给子组件a、先在父组件中的.json文件中引入子组件(相对路径){ "usingComponents": { MyToast:"相对路径(子组件)" }}b、在父组件写法:通过viewText="{{viewText}}"传向子组件<MyToast viewText="{{viewText}}" bind:myEvent="OnViewText"></MyToast>c
2020-12-01 08:31:18 450
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人