分页技巧 v1.0+ 版本的时候使用过滤器 limitBy 实现 v2.0+ 版本的时候使用compute使用 slice 方法实现 data:{ pageNum:10 }, computed:{ newArr:()=>{ return this.oldArr.slice(0,this.pageNum) } } //获取更多的时候改变 pageNum,遍历数组时遍历新newArr  mounted钩子函数 在mounted钩子函数中不能保证所有的子组件都被挂载完毕,如果希望在所有子组件挂载完毕再

通过自己所学的这段时间,利用空余时间,使用vue3.0脚手架搭建的一个关于后台的管理模板,所实现功能也是模仿一个后台的界面,数据分为两种存放,一种是直接存储到mlab,这里的数据是存放这登录注册,只有注册了自己的账号才能访问到页面,另一些数据直接存放在easy-mock里, 源码地址:https://github.com/MrZHLF/vue-admin 自己需要搭建vue3.0的脚手架,在这里就不用讲关于vue3.0的脚手架怎么搭建.vue3.0脚手架需要node版本10以上,这样的话,可以使

网上讨论的文章已经很多了,这里举一个简单的例子来讨论一下 Composition API 的用法,具体问题才好具体讨论嘛. 假如我们要做一个论坛的讨论列表和分页,以前是把需要的数据都放在data里面,事件都放在methods 里面,代码少的话还好分辨,如果代码多了,看着就头疼了. 现在vue3.0可以按照业务关系分成多个管理类来管理这些代码. 比如帖子列表+发帖功能,我们先做一个模板: (简单表示一下,不做美化处理了) <template> <div> 论坛列表 <div v

前言 不会 webpack,遇到报错就一头雾水,完全不知道怎么办,而且体积还大速度还慢. 所以尤雨溪做了 vite 后就很向往,只是知道自己水平有限还是等大佬先趟趟坑,等差不多了在跳. 现在vite2发布了,官网也有了,网上也能找到大佬写的相关资料,时机应该成熟可以往里跳了. 所以打算做个开源博客,一边做这个小项目,一边学习 vite2 和vue3,还有相关知识. 为啥选择博客呢?因为功能相对比较简单,不考虑皮肤等功能的话. 而且大家都比较熟悉,没写过博客总看过博文吧. 所以呢,业务需求方面一说

项目搭建好了之后是不是可以编码了呢? 等等不要着急,我们是不是应该先设计一下?比如博客的功能等? 博客设计 先做个简单的个人博客,因为是个人版,所以可以省略注册.登录这些功能,表结构也可以简单一点. 基础功能:添加博文.显示博文.博文列表+查询+分页.讨论列表和添加讨论. 虽然功能弱了一点,但是麻雀虽小五脏俱全,vite2 和 vue3 的基础用法也可以体现一些. 功能设计 是不是做成图更明显一些? 代码设计 model设计 model代码 先来看看 model 的代码. /src/model/

我们再来看一下管理类的设计. Composition API,就是组合API的意思,那么是不是应该把js代码分离出来,做成独立的管理类的形式呢? 这样代码可以更整洁一些,主要是setup里面的代码就不会乱掉了. 管理类 import webSQLHelp from '../store/websql-help' import { blog, blogForm, blogList, articleList, discuss, discussList } from './blogModel' impo

前言 迟来的Vue3文章,其实早在今年3月份时就把Vue3过了一遍.在去年年末又把 TypeScript 重新学了一遍,为了上 Vue3 的车,更好的开车.在上家公司4月份时,上级领导分配了一个内部的 党务系统开发 ,这个系统前端是由我一个人来开发,功能和需求也不怎么复杂的一个B 端 系统,直接上的 Vue3 + TypeScript + Element Plus 开发的,开发两周到最后的上线,期间也遇到很多小坑,很多无处可查,慢慢琢磨最后还是克服了. Vue3 + TypeScript Stu

IndexedDB 的官网 https://developer.mozilla.org/zh-CN/docs/Web/API/IndexedDB_API 这个大概是官网吧,原始是英文的,现在陆续是出中文版.有空的话还是多看看官网. 简介 IndexedDB 是一种底层 API,用于在客户端存储大量的结构化数据(也包括文件/二进制大型对象(blobs)).该 API 可以使用索引实现对数据的高性能搜索. 简单的说就是 -- 能装!indexedDB 是前端的一种"事务型对象数据库",可以

一.前言 昨晚可能是因为更新完文章后,导致过于兴奋睡不着(写代码确实太容易让人兴奋了),结果两点多才睡着,大东北果然还是太冷了. 不知道是不是因为膝盖和脚都是冰凉的,所以才导致很晚才能入睡? 刚眯了一会,大约一个小时吧,感觉不错,接着又想学习了. 二.列表界面展示示例 现在要做的就是把打到页面的数据,带样式,也就是说好看点显示. 之前我们在<Vue3学习(二)之 集成Ant Design Vue>这篇文章中,有提及组件的使用,对于一个前端不是很好(后端也不咋的),本着拿来主义,我们能现成的是最

Vue2 0.前言 首先说明:要直接上手简单得很,看官网熟悉大概有哪些东西.怎么用的,然后简单练一下就可以做出程序来了,最多两天,无论Vue2还是Vue3,就都完全可以了,Vue3就是比Vue2多了一些东西而已,所以:要快速上手的,滤过本篇博客,自行查看Vue官网即可 1.基础篇 1.1.初识Vue 下载Vue.js,链接:https://cn.vuejs.org/v2/guide/installation.html 开发版和生产版就字面意思 Vue开发工具:vscode(IDEA也可以写Vue

| 在日常的移动端开发中,经常会遇到列表的展示,以及数据量变多的情况下还会有上拉和下拉的操作.进入新公司后发现移动端好多列表,但是在看代码的时候发现,每个列表都是单独的代码,没有任何的封装,都是通过vant组件,里面充满了过多的重复代码,在有bug或者有需求变更的时候,每次的改动都要对很多个相同逻辑的页面组件进行修改,于是花了一点时间,将其进行封装,发现还是节省了很多的时间.自己做一个记录. 前端提升生产力系列文章 1.前端提升生产力系列一(vue3 element-plus 配置json快速生

随着Vue3和TypeScript的大浪潮不断袭来,越来越多的Vue项目采用了TypeScript的语法来编写代码,而Vue3的JS中的Setup语法糖也越来越广泛的使用,给我们这些以前用弱类型的JS语法编写Vue代码的人不少冲击,不过随着大量的学习和代码编写,经历过一段难熬的时间后,逐步适应了这种和之前差别不小的写法和冲击.本篇随笔介绍总结了Vue3中一些常见的基于TypeScript的Setup语法与组合式 API的处理代码案例. TypeScript(简称ts)是微软推出的静态类型的语言,

在开发的过程中,上传文件或者导入数据是一件很常见的事情,导入数据可以有两种方式: 前端上传文件到后台,后台读取文件内容,进行验证再进行存储 前端读取数据,进行数据验证,然后发送数据到后台进行存储 这两种方式需要根据不同的业务才进行采用 这次用.Net6.0+Vue3来实现一个数据导入的功能 接下来分别用代码来实现这两种方式 1. 前端上传文件到后台进行数据存储 1.1编写文件上传接口 [DisableRequestSizeLimit] [HttpPost] public IActionResul

1.  前言 在开发工作过程中,我们会遇到各种各样的表格数据导入,大部分我们的解决方案:提供一个模板前端进行下载,然后按照这个模板要求进行数据填充,最后上传导入,这是其中一种解决方案.个人认为还有另外一种解决方案,不一定会前面的方案好,方便,但是可以减少人为操作,减少出错,更为通用,就是进行动态数据导入,前端进行自定义导入数据,配置数据对应关系,最后提交导入结果. 2.  如何实现 2.1使用技术 后台使用.Net6.0,前端使用Vue3 2.2实现思路 前端通过Excel表格数据导入,导入后客

最近有项目反应,在服务器CPU使用较高的时候,我们的事件查询页面非常的慢,查询几条记录竟然要4分钟甚至更长,而且在翻第二页的时候也是要这么多的时间,这肯定是不能接受的,也是让现场用SQLServerProfiler把语句抓取了上来. 用ROW_NUMBER()进行分页 我们看看现场抓上来的分页语句: select top 20 a.*,ag.Name as AgentServerName,,d.Name as MgrObjTypeName,l.UserName as userName from

用JS实现前端分页页码管理,可以很美观的区分页码显示(这也是参考大多数网站的分页页码展示),能够有很好的用户体验,这也是有业务需要就写了一下,还是新手,经验不足,欢迎指出批评! 首先先看效果图: 这是初始页面(也就是第一页)的界面,如果为第一页时,则首页和上一页按钮不可用,为了展示分页的效果,我当前的分页是一条一页. 这是页码大于5页时展示的效果:1,2页始终始终显示(考虑到用户体验) 这是最后一页的效果图: 下面直接上js代码: //页码显示 $(function(){ var dqPage

一.基础实体 @MappedSuperclass public abstract class AbsIdEntity implements Serializable { private static final long serialVersionUID = 7988377299341530426L; public final static int IS_DELETE_YES = 1;// 标记删除 public final static int IS_DELETE_NO = 0;// 未删除,

最近比较忙,前期忙公司手机端接口项目,各种开发+调试+发布现在几乎上线无问题了:虽然公司项目忙不过在期间抽空做了两件个人觉得有意义的事情,一者使用aspnetcore开发了个人线上项目(要说线上其实只能ip访问,没有域名哈哈),其架构组成由:aspnetcore1.0.0+redis+ postgressql+TaskMainForm服务,这个项目在后期会开源出来供大家分享学习,站点地址点这里心声网:一者是目前正在做的后台管理框架一叶子,现目前刚好吧js分页插件shenniu.pager.js写

这里将要和大家分享的是学习总结使用TagHelper实现分页标签,之前分享过一篇使用HtmlHelper扩展了一个分页写法地址可以点击这里http://www.cnblogs.com/wangrudong003/p/5607743.html,今天分享的是net core的另外一种能写分页标签的方法具体是继承TagHelper,如下将讲述实现一个简单分页和总要注意步奏. 1.继承父类TagHelper并重写Process方法(这里还有一个异步的方法ProcessAsync各位可以自己尝试下) 2.

声明,本博客从csdn搬到cnblogs博客园了,以前的csdn不再更新,朋友们可以到这儿来找我的文章,更多的文章会发表,谢谢关注! 有时候闲的无聊,看到extjs那么肥大,真想把自己的项目改了,最近看到一款轻型的UI感觉不错,但是在网上找了好多教程,但是没有一个是完全是C#asp.net写的 无耐下,自己写了下,感觉效果不错,故拿出来和大学分享一下,希望可以抛砖引玉作用. 由于好多人都只是拷贝代码,故在此全用图片作说明. 图片效果图1 这个界面是上左右下结构 左边是一棵树 右边是一个表格 上部

php分页类文件: <?php /** file: page.class.php 完美分页类 Page */ class Page { private $total; //数据表中总记录数 private $listRows; //每页显示行数 private $limit; //SQL语句使用limit从句,限制获取记录个数 private $uri; //自动获取url的请求地址 private $pageNum; //总页数 private $page; //当前页 private $co