大前端
关注
分享
扫一扫
文章平均质量分 60
Vue,React,JS,html,Bootstrap,layui and so on
李公子lm
宝剑锋从磨砺出，梅花香自苦寒来。
展开
-
手把手教大家开发一个基于DeepSeek的对话AI
最近的DeepSeek可谓是非常火，到处都在讨论DeepSeek，而且各种应用都开始接入DeepSeek，那我今天我也来凑凑热闹，查看DeepSeek官网可以看到有开放平台，调用方式也比较简单，那么话不多说，我们就基于DeepSeek开发一款属于自己的对话式AI应用。对于技术栈的选择，由于是一个对话式AI应用，而且功能也是比较简单的，所以暂时不考虑接入后端，就一个前端页面能对话就可以满足需求了。所以采用Vite+Vue3来做这么一个小应用。原创 2025-03-08 13:41:29 · 580 阅读 · 0 评论 -
JS比较多个时间有没有交集
今天遇到一个稍微有点意思的问题，记录一下，当然并不是很复杂的需求，解决方式也非常简单粗暴，当然如果你有更好的想法，欢迎评论交流。我们只需要判断，第一个时间的结束时间小于等于第二个时间的开始时间或者第二个时间的开始时间大于等于第一个时间的结束时间即可。数组长度未知，但是每个元素的开始时间都是小于等于结束时间的。我就简单说下我的思路，首先如何判断两个时间之间是否存在交集，存在交集有哪几种情况。假如我们有一个对象数组，里面存的都是时间，开始时间和结束时间，类似下面这样。那么不存在交集就两种情况。原创 2022-08-24 17:26:54 · 2106 阅读 · 0 评论 -
Vue Element表格实现滚动加载
需求背景最近有个需求，需要根据用户输入的数字，生成对应行数的表格数据，比如输入10，那就是要生成一个10行的表格，1000就是1000行，表格内容不算复杂，感觉还是一个蛮简单的需求，谁知做着就发现问题了。就是当输入的数字超过1000的时候，明显感觉表格加载的有点卡顿，于是开始寻找解决之法。解决思路首先查看生成1000行表格数据所需的时间，由于计算过程是由js实现的，所以可以用console.time('time')console.timeEnd('time');来查看代码执行耗时，time和原创 2022-04-25 11:23:02 · 3979 阅读 · 2 评论 -
JS循环及跳出循环总结
前言今天来总结一下JS中循环方法的使用，以及如何跳出循环/遍历。正文跳出循环有四种方式break 用来跳出循环.continue 跳过当次循环，继续下一次的循环return 跳出循环，并返回调用函数，之后的代码不在执行。thorw Error() 用来跳出循环,之后的代码不在执行,需要配合try catch使用for循环 TestFor () { for (let i = 0; i < 5; i++) { console.log(i)原创 2022-01-12 20:00:00 · 6052 阅读 · 1 评论 -
nginx 代理解决跨域问题
前言可能在某些时候我们的前端项目需要访问一些外部的接口，比如Apollo等，而直接使用axios发送请求的话，会报跨域的错误，具体什么是跨域这里就不啰嗦了，如下图。这个接口地址当然是正确的，可以放到接口测试工具里试一下。解决跨域有很多种方式，但是大多数方式都需要服务端配合，这里加一句题外话，.Net Core项目如果允许跨域的话，可以在StartUp.cs里添加如下的配置。 app.UseCors(builder => builder.AllowAnyOrigin()原创 2021-06-28 11:26:23 · 5951 阅读 · 2 评论 -
80行js代码写一个俄罗斯方块小游戏
1.俄罗斯方块之前收藏了一个html页面的小游戏，觉得挺好玩的，也特别有学习价值，所以分享给大家，先来张效果图。俄罗斯方块2.代码先看代码，然后在简单说几句，源码会在最下方的微信公众号里，关注一下，回复“俄罗斯方块”即可获取。var map=eval("["+Array(23).join("0x801,")+"0xfff]");var tatris=[[0x660...原创 2018-10-29 16:37:00 · 491 阅读 · 0 评论 -
手把手教你用JS写一个图片轮播效果
1、前言写页面的时候，有些地方经常会用到一些轮播图，比如主页Banner的轮播，或者在页面最下面的小图片轮播，这篇文章就教大家如何写一个小的轮播效果。2、正文先放一张效果图。图片轮播然后直接看代码吧。看一下代码，在讲里面的原理。 <div id="content"> <div id="content_img"> ...原创 2018-10-29 11:35:00 · 487 阅读 · 0 评论 -
<；input type=“file“>； 结合ajax上传图片并预览
1.如何用ajax上传文件想要用ajax上传文件，需要借助一个javascript对象FormData，首先我们先在页面上写一个input<div id="preview"> <input type="file" id="inputfile" accept="image/*"></div>这里在input外面加个div是原创 2018-09-30 09:26:00 · 500 阅读 · 0 评论 -
JS下载文件
1.JS如何下载文件有时候写JS的时候回遇到下载文件的问题，平时如果是一些浏览器打不开的文件，比如一些word,excel,rar,zip,ppt等，.doc、.xls、.rar、.zip、.ppt用下面这个方法可以进行下载。window.open("111.doc");但是如果是一些图片，文本文件，.jpg、.png、.txt就无法使用windo...原创 2018-09-26 16:43:00 · 332 阅读 · 0 评论 -
定义页面上标签栏的图标
1.前言平时在浏览网站的时候可以看到标签里有各种形形色色的图标，挺好看的，那么如何在自己的页面中加上这种图标呢？如图。image.png2.代码加上图标有两种方式，一种是找一个ico格式的图标放到项目的根目录下，并且命名为favicon.ico，就可以了，还有一种方式就是在需要加标签栏图标的页面上加上一行代码。这里面的路径就可以自定义了。<link rel=...原创 2018-10-19 15:00:00 · 504 阅读 · 0 评论 -
JS二维数组使用
1.前言以前我对二维数组的使用非常少，有时候也想不到用二维数组，直到今天遇到一个问题，才想到用二维数组确实是比较好的解决方式，正好给大家简单分享一下。2.需求先放一张做好的网页吧。image.png从图中也能看出来，就是统计一下四个小区的用户入住情况，目前拿到的数据只有四个小区，以后可能还会加新的小区，可能放在以前，直接查询四次，生成四个图表就行了，要...原创 2018-09-15 09:21:00 · 5830 阅读 · 0 评论 -
Bootstrap向弹出的模态框传递参数
1.Bootstrap向弹出的模态框传递参数在一新闻列表页面，点击每一条信息，都打开一个模态框用来显示新闻的详情。那么如何向模态框传值，知道我要打开的是那一篇新闻呢？先看代码。 <div class="new_main" onclick="NewsDetail('2')"> </div>这里写的div里面有个NewsDetail的方法，里面是参数。页面上加一...原创 2018-09-29 11:57:00 · 6722 阅读 · 1 评论 -
Cesium加载geojson线数据，并加高亮效果
1.前言最近有需要加载一些三维的数据，所以研究了下Cesium，写了一个加载json的小程序，加载json线数据，点击线会加高亮效果，先看看效果图。Video_2018-11-21_172143.gif2.正文照例还是先看看代码，在简单说一下思路。<script> var viewer = new Cesium.Viewer('cesiu...原创 2018-11-21 16:32:00 · 11558 阅读 · 0 评论 -
Layui获取弹出窗中输入的值，type=1
1.前言今天遇到一个问题，就是在审批一些东西的时候需要退回，退回就需要输入原因，所以我想的就是，点击退回的时候，弹出一个窗口，在窗口里输入退回原因，然后点击确定。该条记录就被退回了。但是，苦于一直获取不到输入的文本值。今天解决了，记录一下。先看一下效果图。Video_2018-10-12_111212.gif先看一下代码吧。 parent.layer.open({...原创 2018-10-12 11:15:00 · 3432 阅读 · 1 评论 -
Layui select配合input实现可输入，可选择，可搜索
1.前言今天遇到一个问题，客户要求select框可以自己输入，就是在下拉列表里找不到自己想要的选项就可以自己输入，同时还要支持模糊匹配功能，百度了一下，都是讲select配合input，input覆盖在select上面，同时又不完全盖住select，就可以实现，输入，和选择并存了，但是模糊匹配是一个问题。好了先看一张效果图。Video_2018-10-09_150251.gif...原创 2018-10-09 15:24:00 · 26427 阅读 · 11 评论 -
取消laydate的绑定渲染
1.如题，取消laydate的渲染今天遇到一个问题，页面上有一个select选择框，后面是一个input，select有三个选项，标签，姓名和时间，当select选择了时间时，input变身时间选择器，当选择了其他的标签是，input变成正常的文本输入框。刚开始搜了好多资料，没找到取消laydate取消绑定的方法。自己写了一个，算是走了个捷径吧，实现了上述的效果。请看代码。<htm...原创 2018-08-04 14:37:00 · 3710 阅读 · 0 评论 -
laydate在选择时间框中规定分钟的值
1.背景今天使用laydate遇到一个问题，就是在我们公司，加班的话，需要填写加班申请，加班申请必须指定开始时间和结束时间，且加班时长必须是5的倍数，比如说加班2小时，2.5、 3、 3.5等，这样一来，加班时间选择只能选择18:00-20:00 或者18:30-20:30 必须是几点半，或者整点，所以在使用layui选择的时间的时候，就不能再出现像下面这种时间选择框了。imag...原创 2018-08-30 15:23:00 · 1457 阅读 · 0 评论 -
对动态添加的元素加layui上传事件
1.前言最近遇到一个有关layui的问题，一个项目对应多次成果交接记录，一对多的关系，每次成果交接需要上传附件，所以简单点来说，就是动态添加上传input。先来一张做好的效果图。image.png点击添加一个，可以动态添加一个上传元素。如何做到每个上传元素都是好用的呢？其实关键就是给upload.render动态赋值就可以了。请看代码。<link href=...原创 2018-07-31 15:10:00 · 5537 阅读 · 1 评论 -
动态修改LayDate的时间选择区间
1.如何动态的修改laydate的时间选择范围。首先就是把laydate.render给一个变量startDate，然后要修改laydate的时间的事件里加上startDate.config.min里面设置好相应的变量值就行了 ，需要注意一点，这里面的月份需要+1.<!DOCTYPE html><html><head> <meta c...原创 2018-07-31 15:04:00 · 2651 阅读 · 0 评论 -
laydate在选择时间框中规定分钟的值
1.背景今天使用laydate遇到一个问题，就是在我们公司，加班的话，需要填写加班申请，加班申请必须指定开始时间和结束时间，且加班时长必须是5的倍数，比如说加班2小时，2.5、 3、 3.5等，这样一来，加班时间选择只能选择18:00-20:00 或者18:30-20:30 必须是几点半，或者整点，所以在使用layui选择的时间的时候，就不能再出现像下面这种时间选择框了。而是这种效果。...原创 2018-09-03 16:17:29 · 3035 阅读 · 2 评论 -
Vue父页面传递对象到子组件
在父页面如何传递一个对象到子组件呢，先看代码在简单说两句。首先需要一个对象。在data里定义好。 dataSimple: { id: "1", name: "你好", }然后是子组件调用 <Simple ref="simple" :dataSimple="dataSimple" ></Simple>接着在子组件的prop属性下写上对应的参数名 props: {原创 2020-08-28 16:52:22 · 4817 阅读 · 0 评论