-
前端
vue实现数字翻牌器，数字滚动显示，数字动画显示
效果如下： 封装组件<template> <div class="number-grow-warp"> <s... -
前端
echarts自定义图表提示框。echarts tooltip的使用
官方文档：https://echarts.apache.org/zh/option.html#tooltip 使用的是tooltip，如果只是要显示出来，直接设... -
前端
npm run build:prod 文件名、目录名或卷标语法不正确。vscode 开发的vue项目打包出错
基本环境： node.js版本：v16.15.1npm版本：8.11.0问题描述： 出现文件名、目录名或卷标语法不正确这个报错是... -
前端
vue3使用axios的请求封装与跨域配置
以前vue2当中的详细的请求封装以及跨域的可以参考：https://www.tnblog.net/aojiancc2/article/details/4751其实... -
前端
vue element ui Notification增加关闭按钮。vue动态创建按钮，并添加事件
element ui Notification默认没有关闭按钮这些，但是内容可以写html就可以进行一些自定义了。实现效果如下： 实... -
前端
element ui table 表格行颜色自定义。单元格颜色 。根据条件改变行或者单元格的颜色
行列样式主要是这几个 属性名 描述 回调函数 row-class-name 行的 className 的回调方法，也可... -
前端
vue刷新子组件数据。Vue在父组件点击条件筛选的时候刷新子组件数据。vue如何让子组件重新渲染
Vue在父组件点击条件筛选的时候刷新子组件数据比如像点击这块班级条件的时候下面的图表数据，就是不同平台的完成... -
前端
echarts 仪表盘gauge颜色渐变。echarts圆环进度条。echarts圆环进度条弧形
效果如下： 配置项代码如下// 基于准备好的dom，初始化echarts实例 const myChart = this.$echarts.init(docu... -
前端
vue3 Element Plus 表格使用,vue3常用界面搭配。vue3基础模板使用
一个简单的表格加时间搜索界面效果如下： 代码如下： <template> <div class="app-contain... -
前端
vue elementui，vue element plus 文件上传的时候设置其他参数。后台.net接收传递的额外参数
比如上传文件的时候额外传递两个select选择的值 前台前面上传文件的时候要提供默认参数很简单，el-upload绑定一... -
前端
vue-element-admin左边树形，右边格子的布局。vue element ui模板
[TOC]效果如下： 代码如下：<template> <div class="app-container student-archives"&g... -
前端
element plus 下拉列表默认选中有延迟
会先加载id或者编号，然后有点延迟的时间才转换成内容。 可以这样解决，绑定的时候给中文名字，然后在改变的时... -
前端
vue3 Element Plus 表格使用， vue-admin-beautiful表格使用。Element UI Plus弹窗更新，el-pagination分页，表格上面按钮搜索框,搜索框放在一行加入选择框等。Vue模板
最最简单的表格 <template> <el-table :data="tableData" style="width: 100%"... -
前端
vue使用qrcode生成二维码。code length overflow. (1740>1056)
安装qrcode依赖 npm i qrcodejs2 --save 使用代码 <div class="qrcode" ref="qrCodeUrl&qu... -
前端
flex实现一行显示n个数量的布局，不同屏幕宽度下显示不同的数量，自适应一行显示的个数
[TOC]要实现的效果如下: 其实原理也非常简单，父元素主要是主要就是设置一个flex布局，然后flex-wrap设置为需要... -
前端
vue布局模板，前端布局模板，flex布局应用
设计图效果： 代码： <!-- 学习活跃度 --> <template> <div class="learnActivityC... -
前端
echarts 显示坐标点。echarts 自定义显示坐标点。echarts 个性化坐标提升显示，
最简单的显示出来，直接在series中对应的数据项里边设置一下label即可label: { show: true, position:... -
前端
vue使用div实现自定义表格table，实现内容向上循环滚动
效果如下：会循环向上滚动，做成动态图太大了，这里贴一个静态的效果 封装的表格代码如下<!-- 封装可以循... -
前端
vue3 element plus table+Sortable.js 行拖动，表格拖动
要先安装好Sortable.js依赖 cnpm install sortable.js 实现拖动的代码如下可以直接复制运行 <template>... -
前端
vue样式参数化。vue样式绑定值。vue绑定样式。vue可配置样式。颜色参数化，传递颜色
vue样式参数化可以直接使用:style绑定属性即可<div class="modal-container" :style="{width:... -
前端
vue-element-admin左边树形，右边表格的布局。vue模板
大概的界面如下：代码：<template> <divclass="app-container"> <el-row:gutter=&qu... -
前端
vue-element-admin 常用表格与搜索栏界面搭配 。 element ui样式搭配。模板
界面大概的样子：代码（下方有vue3中的写法）：<template> <divclass="app-container"> ... -
前端
vue-element-admin api相关，api配置。vue-element-admin 统一配置api前缀
api请求的前缀是配置在env.xx文件里边env.development是本地环境，env.production这个文件配置的是正式环境这里... -
前端
js给不同用户随机显示不同颜色
彼年豆蔻，谁许谁地老天荒。首先js随机产生颜色思路就是随机产生6个16进制的数字即可//js随机产生颜色 function... -
前端
css3伪类选择器 nth-child ， 循环变色。css最后一个元素
选中第一个元素：.container>div:first-child{ background:#abcdff; }选中最后一个可以使用last-child.cont... -
前端
vue 布局页，vue模板页，页面跳转，子页面切换，页面切换。页面模板，布局模板。vue路由配置
vue里边点击菜单切换页面的效果，其实和mvc里边的布局页很类似。使用router-view来挖坑，和mvc里边的@RenderBody... -
前端
windows对象中获取vue对象。vue中使用iframe页面嵌套后，嵌套页里边页面跳转问题，实现外层路由的跳转，实现打开新的tab页面
某些情况下使用iframe可以降低一下耦合度，分隔开项目,不会让一个项目越来越大。 [TOC]vue嵌套iframe页面的方法... -
前端
vue.js组件
什么是vue组件可以重复使用vue实例,相当于可以自己定义一个控件,类似mvc里边的分部页用来重复使用的vue组件语法... -
前端
vue，vue3 打开新页面，页面跳转。vue跳转到一个新页面。vue路由传参
[TOC]VUE页面跳转本地页面跳转 goApplicationCenter() { //进行页面跳转 let path = "/application-... -
前端
vue3 Element Plus 表单输入框放到一行
当垂直方向空间受限且表单较简单时，可以在一行内放置表单。 通过设置 inline 属性为 true 可以让表单域变为行... -
前端
vue-element-admin 获取环境变量的值
环境变量的定义定义在.env.development里边表示开发环境定义在.env.production里边表示线上环境 比如定义两个 ... -
前端
window.open 中传递Authorization header token。vue根据链接下载文件的时候传递header token
直接使用window.open去给一个链接下载文件是传递不了header token的window.open(baseURL + 'DownloadFile/Ar... -
前端
input 文件上传类型限制。上传图片预览，获取上传文件名称，获取上传文件的后缀名，限制文件大小等
限制只能上传图片image/* <input type="file" name="file" id="choiseFile" ... -
前端
vue组件封装，简单的表格组件封装。组件插槽简单使用。Table 组件封装
看到设计图上有一个类似的表格需要重复使用，就封装一个简单的表格组件，方便重复使用，很简单就是做数据展示，... -
前端
vue,vue3组件封装，vue组件模板。简单组件模板。基础组件模板。vue引入自定义的组件。vue使用自定义的组件。插槽slot使用。vue封装格子效果，一块一块的grid布局效果
[TOC]vue封装组件的简单模板贴一个简单模板方便自定义组件的时候直接复制 <template> <div class... -
前端
vue发布命令，vue发布的时候接参数，根据不同配置文件发布.不同环境变量发布
一般发布vue项目都是使用npm run build 但是可以根据不同环境接参数在package.json中的scripts中配置：比如: &... -
前端
vue自定义组件实现右下角悬浮工具栏。vue实现可以拖动的右下角悬浮菜单。点击悬浮菜单，弹出一个自定义的弹窗组件，组件传参。vue模板
创建一个可以拖动的自定义指令创建拖拽代码放到/src/common/drag.js，位置根据自己的情况随便放。代码如下。 ... -
前端
vue elementui 图片预览。el-image-viewer图片查看器。修改图片预览的自带样式。点击哪一个就查看哪一个图片
先引入图片预览的组件 import ElImageViewer from 'element-ui/packages/image/src/image-viewer' e... -
前端
vue markdown编辑器v-md-editor基本用法。vue实现markdown预览
vue markdown编辑器v-md-editor基本用法安装依赖使用npm安装： npm i @kangc/v-md-editor -S 使用yarp安装： ... -
前端
使用dplayer进行视频播放
贴个小demo:<!DOCTYPEhtml> <html> <head> <metaname="viewport"content=&... -
前端
layui表格加入表单元素，单选框复选框什么的
需要实现的效果：方法一：前端实现使用templet绑定text/html提供绑定的模板：<scripttype="text/html&qu... -
前端
网格系统没有合适的宽度怎么办，比如col-3太短col-4又太宽
可以为这些样式针对性的重新定义一个宽度如下：.col-9{ max-width:73%; flex:0073%; } .col-3{ max-width... -
前端
css实现侧边栏中树枝的效果
[TOC]效果如下就是这种侧边栏中间那一块的效果： 具体效果如下： 左边的虚线是利用ul左边框实现的：border-l... -
前端
css 如何让边框不影响宽度
网上说使用盒子模型box-sizing:border-box即可解决div.box{ box-sizing:border-box; -moz-box-sizing:border-b... -
前端
bootstrap4网格系统，布局
我是一个后端，后端，后端……跑来写样式,吐槽一下,算了该做的还是要做。 外层div使用row,里边使用col就可... -
前端
vue-admin-beautiful plus版本中封装的token。vue项目中获取登录的token
在不同的vue项目中获取登录的token是不一样，就看是怎么封装的就怎么获取。这里贴一下vue-admin-beautiful plus... -
前端
vue中js让悬浮菜单div循环上下移动
封装的方法：runEle() { const thisTemp = this const suspendmenuentrydiv = document.getElementByI... -
前端
VUE-ElementUI DOMException: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported.
这种情况下一般是图片不能跨域引起的。 比如引入了其他网站的图片，或者自己网站的图片也有可能遇到这种情况只... -
前端
vue生成pdf下载。vue把当前页面生成pdf下载。vue根据页面dom id生成pdf下载。vue pdf导出
思路： 通过 html2canvas 将 HTML 页面转换成图片，然后再通过 jspdf 将图片的 base64 生成为 pdf 文件。[TOC]下... -
前端
vue elementui 弹窗el-dialog，自定义弹窗样式，单选按钮el-radio联动
效果如下： 代码如下： <!-- 处理问题反馈使用的弹窗 --> <template> <div> <!... -
前端
vue-elementui 图片显示，本地图片路径访问方式，表格里边显示图片，动态加载图片。vue样式里边引用assets里边的图片
[TOC]vue-elementui 图片显示<el-image style="width: 32px; height: 32px" :src="src" ... -
前端
bootstrap一个不错的树形组件
先看看效果嘛，还是有点乖的，功能也算是比较强大，支持右键菜单，支持随意拖动。哈哈哈长得好看，还有内涵html:... -
前端
vue使用highcharts
一：使用npm下载highcharts依赖npminstallhighcharts--save这步一定要做，否则即使执行了npm install highcharts... -
前端
vue使用axios调用接口，解决跨域。vue调用api接口。vue请求封装
一.先下载axios依赖npminstallaxios二.在需要的地方引入importaxiosfrom'axios'三.环境准备好了之后就可... -
前端
使用node.js压缩js文件
node.js压缩Js文件需要安装uglifyjs，打开cmd输入下面命令：npm install uglify-js -g安装好后就可以压缩js文件... -
前端
vue脚手架安装jquery
虽然vue不推荐使用jquery，还是可以掌握一下引入jquery的方式一：下载vue依赖npminstalljquery--save下载完后在n... -
前端
vue3，vue组件，props给一个对象参数。vue组件间传参数,vue父组件给子组件传参数。组件参数类型。父组件调用子组件的方法。vue组件事件监听，给子组件传递方法，子组件调用父组件方法
[TOC]组件可以使用props给组件传值，可以同时传递多个，可以是任意类型，比如字符串或者对象。 下面是个简单的... -
前端
vue给当前点击的元素添加样式 。vue实现tag类型的菜单选中切换效果，vue点击切换样式效果，vue点击选中效果。vue类似tag菜单的样式选中效果
[TOC]比较简单的静态Tag选中效果 页面： <div class="title-wapper"> <div class="... -
前端
vue路由实现一个二级菜单。vue页面切换，vue子页面切换。vue菜单选中
效果如下：这种二级菜单或者三级菜单如果我们使用.net 的mvc来实现就很简单，整两个布局页可以轻松搞定来试试使... -
前端
vue路由
后端人员来研究一哈前端的东西，感觉还是非常有趣实现一个简单的路由切换可以创建一个关于路由的js然后在里边配... -
前端
import 引入vue 组件命名规则。vue引入自定义的组件
端午节快乐~其实就是两种方法：第一种就是完全按照组件的名字去使用<template> <MainLayout> <... -
前端
vue脚手架项目发布
使用命令：npm run build即可我们在命令行中输入npm run build命令后，vue-cli会自动进行项目发布打包。你在pack... -
前端
echarts折线图使用示例。包含颜色渐变，节点样式，图例legend样式等
设计图如下 代码如下<!-- 学习趋势图 --> <template> <div class="learnTrendChartC... -
前端
elmentui 弹窗，自定义样式 修改里边默认样式，自定义header，自定义头部等。Vue自定义组件的使用。Vue模板。Vue弹窗实现反馈页面
[TOC]这样一个效果 主要分为三块： 一块是：一个简单的可以拖动的右下角悬浮菜单组件封装，点击它弹出这个弹... -
前端
vue elementui 常用表格，条件查询，类型解析，弹窗显示详情，图片显示，图片预览
[TOC]第一版 页面<template> <div class="app-container"> <el-card> ... -
前端
vue element admin 使用svg图标
vue-element-admin基础模板中，已经封装好了使用svg图标的组件，所在路径为：src/icons/svg（有些模板是在src/sv... -
前端
vue elementui 基础表格布局，基础表格+条件+搜索框布局,类型处理，父子组件方法调用
[TOC]基础表格+条件+搜索框布局效果如下：代码如下： <template> <div class="app-containe... -
前端
.net core配合qadmin简单使用
qadmin是使用vue和layui组合的一个前端模板把模板中的首页复制进来<!DOCTYPEhtml> <html> <h... -
前端
vue路由的简单使用，不使用脚手架
不使用脚手架，直接使用路由的形式，直接贴代码吧<!DOCTYPEhtml> <htmlxmlns="http://www.w3.org... -
前端
echart常用折线图，带面积渐变的折线图
效果如下： html: <div class="labroom-trend"> <div class="labroom-trend-tit... -
前端
关于tnblog markdown
我们对markdown进行了深度的优化和高度的自定义功能比如更人性化的即时预览效果扩展语法等并且持续不断的完善优... -
前端
扩展markdown增加mermaid支持画图
我看网上没有什么资料，只有说怎么去用它，没有说怎么才能用它。那就自己慢慢研究在让markdown支持，要自己实... -
前端
markdown预览效果优化，差点哭出声的艰辛历程
其实要实现的效果很简单就是想写文章的时候能即时预览效果，但是自带的会出现看不到的情况，且回车也无法改变这... -
前端
nginx 静态资源gzip压缩与缓存，解决静态资源加载慢的问题
在http模块中开启gzip压缩# 开启gzip gzip on; # 启用gzip压缩的最小文件，小于设置值的文件将不会压缩 gzip... -
前端
使用markdown编辑器editormd,图片上传
静态资源路径问题可以参考：https://www.tnblog.net/aojiancc2/article/details/3436自定义工具栏可以参考：http... -
前端
editormd静态文件路径问题
准备给tnblog上一个markdown的编辑器，毕竟这个感觉逼格要高一点，嘿嘿，然后看了一下editormd还不错。无坑不成... -
前端
vue改写案例,vue综合案例
原先的写法是使用razor直接解析的：里边涉及到属性绑定，判断，方法判断等使用vue改写如下：html:<divid=&quo... -
前端
uni-app自定义导航栏按钮
自定义导航栏按钮文档https://uniapp.dcloud.io/collocation/pages?id=app-titlenview-buttons 按钮类型默认提... -
前端
css3 渐变 两边浅中间深。由中间向两边。 div边框渐变色
设计图是这样的 可以使用线性渐变语法：background: linear-gradient(direction, color-stop1, color-stop2, ... -
前端
vue根据文件地址下载文件。vue下载文件的时候给header传递token
最简单的方式一句话搞定 window.location.href = res.success.url 动态创建a标签触发点击事件 //根据文件地址... -
前端
css 实现手指上去图片放大，css实现鼠标移到图片上图片放大
代码如下： <!DOCTYPE html> <html lang="en"> <head> <meta charset=&... -
前端
element ui表头样式，行样式，行间距。自定义分页条样式
element ui表头样式，行样式element ui表头样式，行样式可以使用header-cell-style和row-style设置 <el-tab... -
前端
css 实现消息气泡效果。 vue element admin右上角添加一个信息提醒的菜单
如图，这种聊天气泡效果 这个其实挺简单，没什么好说的，只是有一个点就是当气泡里边的数字，不断变大的时候，... -
前端
百度编辑器增加菜单栏按钮，自定义菜单
第一步：找到ueditor.config.js文件中的toolbars数组，增加需要的菜单栏名称第二步：然后找到labelMap数组，对应... -
前端
flex 每行3个。flex一行显示3个。flex 每行显示4个自适应排列。flex每行固定几个布局。css 格子栏效果，css实现框框效果。模板。小屏下一行显示4个，大屏下一行显示5个
[TOC]效果如下，每行显示3个自适应排列 其实也很简单，只需要设置父元素flex布局，然后设置一下换行排列，flex-... -
前端
layui 弹窗遮罩层把弹窗挡住问题
代码：layer.open({ type:1, area:["300px","300px"], content:$("#addvieww"... -
前端
bootstrap左侧菜单如何固定，解决左侧滚动条滚动的时候页面的滚动条也滚动的问题
很简单直接一句样式搞定！page-sidebar-fixed 加入到Body中即可，也可以使用Jquery动态添加，这样就可以在某些页... -
前端
js时间格式化,vue.js时间格式化，带T 时间格式化
也可以借助moment库， 参考：https://www.tnblog.net/aojiancc2/article/details/8079moment库有点大，推荐可以... -
前端
ASP.NET MVC + WebUploader实现文件上传二：使用中的一些问题
如何把文件选择按钮换成自己的因为WebUploader设置关联的上传id会有他的样式，有时候想换成自己的开始想的是添加... -
前端
实现返回顶部效果2
实现返回顶部效果1：http://www.tnblog.net/aojiancc2/article/details/164效果如下：html:<divclass="r... -
前端
解决yarn install非常慢的问题,解决yarn下载慢的问题
在国内不管使用npm还是yarn，安装速度都很慢。因为镜像源地址在国外，有墙的存在，导致速度很慢，这里换上淘宝的... -
前端
vue切换菜单，vue菜单选中。跳转页面通过原生js设置选中样式。vue中使用原生js方法。js 找到当前对象的兄弟对象。js获取子节点。js获取父节点。js获取当前元素的同级节点
vue切换菜单,跳转页面通过原生js设置选中样式可以利用上面那个js获取当前元素的同级节点后先设置默认的样式，然... -
前端
JS抽奖特效练习之四:平滑加减速旋转
我们进行js抽奖点击开始的时候会不停的绕着圈跑，然后停下来，这期间会先变快，然后变慢，然后停下来。所以这里... -
前端
图片在一个div内容水平与垂直居中
图片宽度与高度设置成80%,然后设置margin-top:10%,margin-left:10%就可以了感觉应该没有这么简单哇，不过反正就... -
前端
css3 实现ps文字外发光效果,实现一串文字背后灯光高亮效果。实现文字发光。css实现实现文字背景高亮
CSS3 并没有直接设置发光效果的属性，但是利用text-shadow属性实现此效果text-shadow: h-shadow v-shadow blur c... -
前端
vue，js 时间格式化库moment使用。js获取时间日期
[TOC]官方网站：http://momentjs.cn/ moment库有点大，推荐可以使用day.js官网：https://dayjs.fenxianglu.cn/E... -
前端
layer弹窗+ef引入独立页面进行操作
使用layer弹窗进行操作的时候我们可以使用type=2，来把一个独立的页面指向content内容例如我们有一个表格，点击... -
前端
评价上编辑器之坑
想给评论功能加上表情，传图片，贴代码等功能。所以就要把textarea换成一个编辑器。以为很简单的就是把textarea... -
前端
js,css异步加载
有些时候为了效率，我们需要js与css能够异步加载方法1：直接在后面加一个async的关键字<scriptsrc="~/li... -
前端
高德地图实现一定范围内的关键字搜索
可能你的js后面还需要加载的插件：https://webapi.amap.com/maps?v=1.4.15&key=2xx&plugin=AMap.Distri... -
前端
layui布局
Layui 使用layui-container container来指明一个容器版本<divclass="layui-containercontainer"sty... -
前端
layui table使用templet，解析状态字段,逻辑处理等
比如有这样一个表格：我们想把其中的状态变成具体的文本描述，就可以使用layui table的templet方法1：直接给一个... -
前端
干货！div滚动到一定位置就固定他。Vue中实现一侧滚动到底部就固定
尊重原创：转载请注名出处div滚动到一定位置就固定他，例如左边的内容很多，右边的内容很少，如果不处理滚动到一... -
前端
Layui Select添加选择事件,Layui 下拉列表
html<selectname="label"id="atype"lay-filter="atype"> <optionvalue... -
前端
layui 表单模块常见问题
layui 设置select宽度直接设置select外层的宽度就行，layui的select会自适应宽度layui 设置select会被百度编辑器... -
前端
vue-element-admin 配置相关， 关闭页面上的设置等
设置在：src目录下的settings.js配置文件，showSettings设置成false即可关闭页面上的设置其他设置module.exports... -
前端
layui表格条件查询
很简单，就是layui表格的reload方法，传输入的条件回去就行了。where直接用json形式带条件回去就行了，条件都传... -
前端
Markdown,editormd编辑器Editor.md自动保存插件的开发
简介: Markdown编辑器Editor.md自动保存插件的开发。文章编辑器没有自动保存功能怎么行，万一不小心忘记保存不就... -
前端
editormd，Markdown编辑器Editor.md图片粘贴插入插件的开发
Markdown编辑器Editor.md图片粘贴插入的开发。最近发现编辑器图片上传很不方便，不能像其他编辑器一样粘贴插入... -
前端
Layui水平二级菜单时长不显示的问题
调用一下初始化方法Init就可以解决了 -
前端
layui表格的简单使用,layui table 数据展示，数据修改，数据更新。layui table的简单使用
前端代码如下： <!DOCTYPE html> <html lang="en"> <head> <meta chars... -
前端
修改百度编辑器样式，图片样式，字体样式等
给百度编辑器加默认样式百度编辑器加载的时候是用一个iframe加载的，我们可以自己添加样式：在themes—>ifram... -
前端
vue.js 双向绑定简单例子
经典的一个vue.js双向绑定小例子：<!DOCTYPEhtml> <html> <head> <metacharset="u... -
前端
版本更新后,js css 如何刷新缓存
方法1 更新文件后更改css/js文件名方法2给css/js文件加个版本号每次修改css文件后还要修改css的文件名有点麻烦，... -
前端
bootstrap tab菜单
贴代码：<divclass="tabbable-line"style="margin-top:10px"> <ulclass="na... -
前端
layer.confirm用法
layer.confirm用法layer.confirm("请谨慎修改!",{btn:['确定','取消'],title:"... -
前端
js获取文本框，单选框，复选框，下拉列表等值
html:<formid="form1"runat="server"> <div> <table> <tr> ... -
前端
css3 伪类选择器 before和after。实现简单的标题。清楚浮动。红黄蓝效果。实现下方横线，Tab菜单效果
伪类选择器before和after，实现一个简单的标题效果 代码如下 <!DOCTYPE html> <html lang="en&... -
前端
Easyui datagrid 编辑结束时combobox显示value而不显示text
在调用datgrid编辑结束时 $(‘#dg’).datagrid(‘endEdit’, editIndex); datagrid的combobox会显示出value，...
