- 博客(44)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 前端离开后端就不能开发项目了？
如果后期页面更新了内容，最后需要将现有的数据备份，安装新版本后在重新导入一下即可！当然由于本地存储有大小限制，存一些小数据还是可以的，但是存放大数据就肯定不行了。打完包之后，直接在build文件夹下运行exe安装包，可以选择安装目录。基于这个思路，我们创建多个js文件当成你的每个的功能表。在没有数据库的情况下，我们可以有很多种选择，比如：本地存储！第二步：封装node.js对js文件的操作功能。根据你需要的包直接打相应的命令，就可以了！安装成功后直接运行，就可以使用了！有了这个思路，创建一个基于。
2023-12-15 16:31:22
677
原创 Js基础五：算出两个时间段的时间
老规矩：不多说，上代码let startTime = new Date(el.actualTriggerTime.replace(/-/g, "/"))let endTime = new Date(el.finishedTime.replace(/-/g, "/"))var dataDiff = endTime.getTime() - startTime.getTime()//天数var dayDiff = Math.floor(dataDiff / (24*3600*1000)) //小时v
2022-04-28 11:53:38
683
原创 css基础一：五行代码教你全屏滚动
五行代码教你全屏滚动老规矩话不多说，直接上代码！html{ scroll-snap-type: y mandatory;}section{ block-size: 100vh; scroll-snap-align: center; scroll-snap-stop: always; display: grid; place-items: center;}<section> <div>one</div></section><
2022-04-08 22:38:53
808
原创 vue使用el-table实现自定义表头及内容数据
vue使用el-table实现自定义表头及内容数据老规矩话不多说，直接上代码<el-table :data="rightSet" border> <el-table-column align="center" v-for="(item, index) in rightHeader" :key="index" :prop="item.prop"> <template slot="header"> <span>{{
2022-04-08 22:28:40
2387
原创 Js基础四：数组去重中
去重数组中的对象老规矩废话不多说，直接上代码for (var i = 0; i < newSave.edges.length - 1; i++) { for (var j = 1; j < newSave.edges.length; j++) { if (i = j) { newSave.edges.splice(j, 1) } }}希望能够帮助你...
2022-03-31 13:19:12
307
原创 Js基础三：将两个数组合并成一个新数组
将两个数组合并成一个新数组话不多说直接上代码var arr1 = ['1','2','3','4']var arr2 = ['张三','李四','王五','麻子']var arr3 = []var arr4 = []arr1.map((item,index) => { arr3.push({id:item})})arr2.map((item,index) => { arr4.push({name:item})})arr4.map((item,index) => {
2022-03-30 09:29:12
2843
2
原创 Js基础二：日期的时间转换 Tue Mar 22 2022 00:00:00 GMT+0800转化2022-03-22
日期的时间转换我们在使用element日期组件的时候我们获取到的数据通常是Tue Mar 22 2022 00:00:00 GMT+0800转化2022-03-22这种的数据结构，那么我们要给他转换成2022-03-22这样的格式。那么我们来上代码//this.dateTime 是需要转换的值let date = new Date(this.dateTime)let y = date.getFullYear()let m = date.getMonth() + 1m = m < 10
2022-03-27 19:55:47
7451
原创 vue下载文件常用的几种方式
vue下载文件常用的几种方式一、直接打开直接打开是指我们直接使用window.open(URL)的方法优点：简单操作缺点：没办法携带token二、我们可以自己封装一个方法，比如如下：import axios from "axios"import * as auth from '@/utils/auth.js'let ajax = axios.create({ baseURL: process.env.VUE_APP_BASE_API, timeout: 100000}
2022-03-27 19:49:07
31171
2
原创 Js基础一：三行代码教你用list数据根据某个字段将数据改成树结构
三行代码教你用list数据根据某个字段将数据改成树结构话不多说直接上代码！//使用set方法，可以直接将数据分类 这里我是根据groupName进行分组的let groupNameSet = new Set(res.result.list.map(item=>(item.groupName)));let resList = []groupNameSet.forEach(groupName=>resList.push({groupName,list:res.result.list.f
2022-03-27 19:38:00
875
原创 js实现点击更换样式
js实现点击更换样式需求：一个列表点击那个列表给他更换背景颜色、边框首先我们在循环的列表中动态添加一个class:class="{'rechargehover':recharge==index}"然后在data中定义recharge：0；然后在点击事件里添加this.recharge = index 记得在点击事件里吧index带进去然后我们给rechargehover添加点击之后的样式就可以了希望这个文章能帮助你...
2021-12-09 10:18:36
2280
原创 css实现吸顶效果
css实现吸顶效果直接给需要吸顶的class添加一下css代码就OK了，超级简单position: -webkit-sticky;position: sticky;top: var(--window-top);z-index: 99;
2021-12-06 10:28:43
1235
原创 怎么 解决uView中u-button点击事件偶发失效问题
怎么 解决uView中u-button点击事件偶发失效问题uview中u-button之所以会出现点击事件偶尔失效是因为uview对按钮做了节流的效果当然如果想解决也是很容易的，我们找到u-button.vue文件的throttleTime里面的default的时间就好了这样就解决了、希望能帮助你...
2021-11-29 09:19:11
3855
3
原创 js处理new Date()
js处理new Date()Date.prototype.format = function (fmt) { var o = { "M+": this.getMonth() + 1, //月份 "d+": this.getDate(), //日 "h+": this.getHours(), //小时 "m+": this.getMinutes(), //分 "s
2021-11-25 10:37:37
642
原创 uniapp生成二维码和条形码
uniapp生成二维码和条形码我们做小程序在我的这个页面经常会遇到有生成二维码的需求，那么我们使用tki-barcode和tki-qrcode这两个组件进行实现我们的需求组件下载地址：“点击这里”下载之后我们解压到项目的components接下来第一步：我们就在使用的那个页面进行引用import tkiBarcode from '@/components/tki-barcode/tki-barcode'import tkiQrcode from '@/components/tki-qrcode/
2021-11-22 09:19:00
4117
5
原创 vue点击图片放大功能
vue点击图片放大功能1、安装配置npm install v-viewer --save2、main.js引用import Viewer from 'v-viewer'import 'viewerjs/dist/viewer.css'//Vue.use(Viewer) 默认配置写法Vue.use(Viewer, { defaultOptions: { zIndex: 9999 }})3、页面使用<!-- 图片循环展示 --><d
2021-10-14 09:30:09
1889
1
原创 实战vue+node+mysql获取数据
实战vue连接并获取mysql数据首先先搭建一个vue脚手架，搭建完成之后进行一下操作！第一步：在根目录下（src）创建一个server文件，如下图就是文件结构了第二步：文件创建完成之后，那么我们现在进行完成数据库的连接配置// 数据库连接配置 db.jsmodule.exports = { mysql: { host: '192.168.×××.××',//mysql连接ip地址 user: '***', password:
2021-09-28 15:33:19
10728
9
原创 uniapp中map的markertap方法及使用
uniapp中map的markertap方法及使用项目需求：我们在做地图的时候经常会做撒点功能，当我们点击这个点的时候，想要获取这个点的信息，那么我们就可以使用markertap属性获取这个点的信息，下面我们来上代码markertap(e){ console.log(e) var clickmarkerId = e.mp.detail.markerId //根据e.mp.detail.markerId跟撒点的id进行判断，如果相等就进行赋值 for(var i=0;i<this.mark
2021-09-03 11:14:46
5622
原创 uniapp搜索出的文字高光并添加锚点
uniapp搜索出的文字高光并添加锚点步骤一：<u-search placeholder="请输入关键字" v-model="keyword" @search="searchVal" :show-action="false" shape="square" bg-color="#FFFFFF" border-color="#D7D7D7"></u-search>在data里定义一个keyword步骤二：<view class="adult_cont" v-html
2021-08-18 16:19:31
328
原创 封装Form表单正则校验--确认密码正则表达式
封装Form表单正则校验为什么要封装：一、因为我们在做项目的时候肯定不会只有一个页面用到这些Form表单的验证！二、可以很方便的在多个页面中进行使用！三、对以后系统升级维护更加方便快捷！步骤一：首先我们先创建一个js文件，我们暂时取名为regMatch.js然后我们在这个js文件开始封装我们需要的Form表单的正则表达式以下我们列举了一些常用到的正则表达式/** * 手机号码正则匹配 * @param {*} rule * @param {*} value * @para
2021-08-16 09:32:44
1998
原创 el-upload上传文件大小限制
el-upload上传文件大小限制当我们在使用element做上传文件的时候，会有要求做上传文件的大小限制这个需求，今天我们就来讲一下限制大小这个功能：首先先讲一下流程，当文件超过20MB的时候让他提示文件大小不能超过20MB，请重新上传。下面我们来看代码：<el-upload class="upload-demo" ref="upload" name="upload" :action="action()" :on-change="(file, fileList) => {
2021-08-11 10:20:47
21488
原创 uniapp懒加载分页
uniapp之懒加载分页前言：最近一直在写uniapp移动端项目，在写到列表时常常会有懒加载分页的功能，那么接下来我们来进行实现懒加载分页的功能，话不多说直接上代码！<u-cell-group> <u-cell-item v-for="(item,index) in cellData" :key="index" @click="goDetails(item)" :title="item.name" :arrow="true"> <template slot="lab
2021-08-09 16:50:01
2156
2
原创 uview组件库之u-cell-group
最近在写uniapp项目的时候一直在用到这个u-cell-group组件，今天就讲一下这个组件！通常我们在写列表的时候会遇到这种情况因为后台给我们返的数据只有后面的内容，所以前面的内容就需要我们来写了，那么我们直接上代码<u-cell-group> <u-cell-item v-for="(item,index) in cellData" :key="index" @click="goDetails(item)" :title="item.name" :arrow="true"&
2021-08-06 15:28:44
14449
2
原创 uniapp列表传item给详情页
uniapp列表传item给详情页列表页：uni.navigateTo({ url:`/pages/driveCard/driveCardDetail?item=${encodeURIComponent(JSON.stringify(response.data.data))}`})详情页面：onload(option){ this.form = JSON.parse(decodeURIComponent(option.item)) //传过来的是一个对象}当然还有其他方法进行跳转传参
2021-08-02 16:20:50
789
1
原创 关于main.js方便小技巧
首先我先举个例子：在开发的过程中有一个发送短信的接口需要联调，而我们在联调接口的时候需要传手机号，而好多的页面都有发送短信的功能。如果我们每次联调接口的时候都把手机号写死传给后端，这样就很麻烦了，那么我们可以利用main.js全局定义的方法进行操作了，那么我们就大大提高了效率!首先我们上代码main.jsconst sendPhoneNumber = {applyPhone:"123456789",approvalPhone:"987654321"};Vue.prototype.sendPhone
2021-06-18 10:49:50
433
原创 Vue项目中全局使用filter对信息进行过滤保密
首先我们先对main.js进行全局配置需求：在项目开发的过程中，我们通常会有敏感信息，而我们需要对这些敏感信息进行保密，比如：身份证我们只显示头和尾，中间部分显示*的需求main.js：Vue.filter("desensitize",function(value,type){ if(!value) return ''; value = value.toString(); if(type == "身份证"){ return value.replace(/(\w{6})\w*(
2021-06-18 10:39:47
603
1
原创 el-select获取option选中的值
话不多说直接上代码！html：<el-form-item label="申请人类型" prop="applicantType"> <el-select v-model="formData.applicantType" placeholder="请选择申请人类型" style="width:100% !important;" @change="applicantTypes"> <el-option v-for="item in ap
2021-05-31 15:25:09
8770
原创 js删除字符串前1个字符、删除后1个字符
//删除最后两个字符串var basics = data[0].stat_datevar basic = basics.substr(0, basics.length - 2) //删除前四个字符串var month = basics.slice(4)
2021-05-26 16:54:59
831
原创 Sourcetree的使用
Sourcetree的使用：首先我们从头开始：一：我们首先创建一个代码仓库，我这里使用的是码云仓库。刚刚创建的一个仓库为例：https://gitee.com/shiwenboa/skd-app二：我们打开下载好的Sourcetree：查看一下图片：第三步：我们需要把仓库地址粘贴到文本框里第四步：我们需要在本地创建一个文件夹，然后把路径写在文本框里。然后点击克隆，那么我们就把这个项目代码成功拉了下来！...
2021-04-02 15:04:26
549
原创 Vue实现增删改查功能
最近公司新接了一个项目，要求没有后端前端画页面写假数据并且相应的功能展示。分给我的大多数都是增删改查一些类似的页面。接下来我们就开始上代码！HTML：<div class="header pad" style="padding: 20px 0"> <el-form ref="formInline" :inline="true" :model="formInline" label-width="100px"
2021-03-23 10:50:05
4990
原创 js获取上月月份、本月月份、上月第一天、上月最后一天
最近做项目的时候经常会做到时间选择器，当然了我采用的是Element中的时间选择器！话不多说，直接上代码 //获取上月月份并且下月以后所有的月份不能选择 <span>选择月份</span> <el-date-picker v-model="value2" type="month" placeholder="选择日期" value-format="yyyyMM"
2021-03-17 10:31:03
2058
原创 微信小程序之获取用户信息适合小白学习
微信小程序之获取用户信息前言：最近公司在写一个微信小程序，功能也比较齐全，今天我就对微信小程序获取用户信息发表一下自己的感悟吧！首先我们先上代码，之后在慢慢解释！wxml：<button open-type="getUserInfo" bindgetuserinfo="onGetUserInfo" class="userinfo-avatar" style="background-image: url({{avatarUrl}})" size="default"></button&
2021-01-08 10:47:25
564
1
原创 插槽和具名插槽的使用
插槽和具名插槽的使用首先我们先注册一个组件然后在#app内部使用html：<div id="app"> <cpn></cpn> <br> <cpn> <button>按钮</button> </cpn> <br> <cpn> <inpu
2020-10-30 15:10:04
663
原创 JavaScript--冒泡排序
冒泡排序在日常开发的时候是一种比较简单的一种排序方式，并且在我们找工作的时候也是最常见的一种面试题了，一般面试官 都会问到冒泡排序首先我们先了解什么是冒泡排序：其实呢，他的原理就是重复地对要排序的数进行大小比较，一次比较两个元素。如果第一个数比第二个数大，则交换顺序，把第二个小的数放前面，不断比较，直到形成一串由小到大排序的数字！以下是举得例子： // 声明一个数组arr，并赋值 var arr = [10,97, 23, 26, 43, 66, 33, 90, 75];
2020-08-04 14:37:31
213
原创 一分钟搭建vue脚手架
一分钟搭建vue脚手架介绍我们知道前端用到最多的主流的框架有Vue、React、Angular；Vue：是相对比较轻量级的框架，是通过进行双向数据绑定来达到驱动页面的效果，很多前端也都是从Vue框架入手的。Vue相比React、Angular还是比较简单，官方文档介绍的很清楚，可以非常快速的通过异步批处理的方式对DOM进行更新，场景使用也更加灵活。搭建脚手架我们前提一定要安装node.js首先我们先查看node.js是否安装node -v如果没有安装node.js或者版本过低当你启动项目的时候
2020-07-29 14:42:48
232
原创 echarts的基本使用--适合小白学习
echarts的基本使用现在很多大公司在做项目的时候，领导都喜欢让做数据可视化大屏，而我们就用echarts来实现这些领导的需求，话不多数，直接上例子！第一步 我们先给他设置下宽度和高度<div style="width: 100%;height: 100%;"> <div id="container" style="height: 100%"></div> </div>第二步 我们在引入echarts.min.js&l
2020-07-19 10:39:59
251
原创 HbuilderX打包Android APP图片详细教程
HbuilderX打包Android APP图片详细教程1、当我们进行打包的时候，我们首先电脑要安装一个HbuilderX官网下载地址：http://www.dcloud.io/2、我们新建一个项目其他的可以先不用修改，然后我们进行打包上线！...
2020-05-07 18:45:30
1849
原创 微信小程序--web-view组件不支持非业务域名http://www..../请重新配置（图片详情-适合小白学习）
微信小程序–web-view组件不支持非业务域名http://www…/请重新配置上一篇我们讲到web-view的基本使用，现在我们说一下当我们准备上线的时候经常会遇到不支持打开非业务域名这种情况，我们首先需要去配置业务域名但是前提呢，我们嵌套的那个网页必须是https协议的，也是说我们需要用https打开你所嵌套的页面。不要像我一样那么点儿背，给了我一个http协议的页面让我嵌套微信...
2020-04-29 14:49:07
2469
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人