排名
6
文章
6
粉丝
16
评论
8

欢迎加群交流技术
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问题描述:
出现文件名、目录名或卷标语法不正确这个报错是...
vue刷新子组件数据。Vue在父组件点击条件筛选的时候刷新子组件数据。vue如何让子组件重新渲染

Vue在父组件点击条件筛选的时候刷新子组件数据比如像点击这块班级条件的时候下面的图表数据,就是不同平台的完成...
vue elementui,vue element plus 文件上传的时候设置其他参数。后台.net接收传递的额外参数

比如上传文件的时候额外传递两个select选择的值
前台前面上传文件的时候要提供默认参数很简单,el-upload绑定一...
vue-element-admin左边树形,右边格子的布局。vue element ui模板

[TOC]效果如下:
代码如下:<template>
<div class="app-container student-archives"&g...
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...
echarts 显示坐标点。echarts 自定义显示坐标点。echarts 个性化坐标提升显示,

最简单的显示出来,直接在series中对应的数据项里边设置一下label即可label: {
show: true,
position:...
vue-element-admin左边树形,右边表格的布局。vue模板

大概的界面如下:代码:<template>
<divclass="app-container">
<el-row:gutter=&qu...
vue-element-admin 常用表格与搜索栏界面搭配 。 element ui样式搭配。模板

界面大概的样子:代码:<template>
<divclass="app-container">
<el-form:inline=&q...
vue-element-admin api相关,api配置。vue-element-admin 统一配置api前缀

api请求的前缀是配置在env.xx文件里边env.development是本地环境,env.production这个文件配置的是正式环境这里...
css3伪类选择器 nth-child , 循环变色。css最后一个元素

选中第一个元素:.container>div:first-child{
background:#abcdff;
}选中最后一个可以使用last-child.cont...
vue 布局页,vue模板页,页面跳转,子页面切换,页面切换。页面模板,布局模板。

vue里边点击菜单切换页面的效果,其实和mvc里边的布局页很类似。使用router-view来挖坑,和mvc里边的@RenderBody...
vue 打开新页面,页面跳转。vue跳转到一个新页面。vue使用this.$router.resolve打开新页面传参

vue页面跳转goApplicationCenter() {
//进行页面跳转
let path = "/application-center"
thi...
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组件封装,vue组件模板。简单组件模板。基础组件模板。vue引入自定义的组件。vue使用自定义的组件。插槽slot使用。vue封装格子效果,一块一块的grid布局效果

vue封装组件的简单模板贴一个简单模板方便自定义组件的时候直接复制
<template>
<div class=&quo...
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...
使用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 如何让边框不影响宽度

网上说使用盒子模型box-sizing:border-box即可解决div.box{
box-sizing:border-box;
-moz-box-sizing:border-b...
vue-admin-beautiful plus版本中封装的token。vue项目中获取登录的token

在不同的vue项目中获取登录的token是不一样,就看是怎么封装的就怎么获取。这里贴一下vue-admin-beautiful plus...
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" ...
vue使用highcharts

一:使用npm下载highcharts依赖npminstallhighcharts--save这步一定要做,否则即使执行了npm install highcharts...
vue使用axios调用接口,解决跨域。vue调用api接口。vue请求封装

一.先下载axios依赖npminstallaxios二.在需要的地方引入importaxiosfrom'axios'三.环境准备好了之后就可...
vue组件,props给一个对象参数。vue组件间传参数,vue父组件给子组件传参数。组件参数类型。父组件调用子组件的方法。vue组件事件监听,给子组件传递方法

[TOC]组件可以使用props给组件传值,可以同时传递多个,可以是任意类型,比如字符串或者对象。
下面是个简单的...
vue给当前点击的元素添加样式 。vue实现tag类型的菜单选中切换效果,vue点击切换样式效果,vue点击选中效果。vue类似tag菜单的样式选中效果

效果如下:就是tag切换效果,选中的样式是三种不一样的
方法一:直接使用dom操作如果选中样式一样,就可以写死...
import 引入vue 组件命名规则。vue引入自定义的组件

端午节快乐~其实就是两种方法:第一种就是完全按照组件的名字去使用<template>
<MainLayout>
<...
elmentui 弹窗,自定义样式 修改里边默认样式,自定义header,自定义头部等。Vue自定义组件的使用。Vue模板。Vue弹窗实现反馈页面

这样一个效果:
主要分为三块:
一块是:一个简单的可以拖动的右下角悬浮菜单组件封装,点击它弹出这个弹窗...
vue elementui 常用表格,条件查询,类型解析,弹窗显示详情,图片显示,图片预览

[TOC]第一版
页面<template>
<div class="app-container">
<el-card>
...
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...
nginx 静态资源gzip压缩与缓存,解决静态资源加载慢的问题

在http模块中开启gzip压缩# 开启gzip
gzip on;
# 启用gzip压缩的最小文件,小于设置值的文件将不会压缩
gzip...
使用markdown编辑器editormd,图片上传

静态资源路径问题可以参考:https://www.tnblog.net/aojiancc2/article/details/3436自定义工具栏可以参考:http...
uni-app自定义导航栏按钮

自定义导航栏按钮文档https://uniapp.dcloud.io/collocation/pages?id=app-titlenview-buttons
按钮类型默认提...
vue根据文件地址下载文件。vue下载文件的时候给header传递token

最简单的方式一句话搞定
window.location.href = res.success.url
动态创建a标签触发点击事件
//根据文件地址...
flex 每行3个。flex一行显示3个。flex 每行显示4个自适应排列。flex每行固定几个布局。css 格子栏效果,css实现框框效果。模板。小屏下一行显示4个,大屏下一行显示5个

效果如下,每行显示3个自适应排列
其实也很简单,只需要设置父元素flex布局,然后设置一下换行排列,flex-wrap:...
layui 弹窗遮罩层把弹窗挡住问题

代码:layer.open({
type:1,
area:["300px","300px"],
content:$("#addvieww"...
bootstrap左侧菜单如何固定,解决左侧滚动条滚动的时候页面的滚动条也滚动的问题

很简单直接一句样式搞定!page-sidebar-fixed 加入到Body中即可,也可以使用Jquery动态添加,这样就可以在某些页...
js时间格式化,vue.js时间格式化,带T 时间格式化

时间格式:/Date(1567138282927)/js格式化为日期格式:newDate(parseInt('/Date(1567138282927)/'.subst...
ASP.NET MVC + WebUploader实现文件上传二:使用中的一些问题

如何把文件选择按钮换成自己的因为WebUploader设置关联的上传id会有他的样式,有时候想换成自己的开始想的是添加...
实现返回顶部效果2

实现返回顶部效果1:http://www.tnblog.net/aojiancc2/article/details/164效果如下:html:<divclass="r...
vue切换菜单,vue菜单选中。跳转页面通过原生js设置选中样式。vue中使用原生js方法。js 找到当前对象的兄弟对象。js获取子节点。js获取父节点。js获取当前元素的同级节点

vue切换菜单,跳转页面通过原生js设置选中样式可以利用上面那个js获取当前元素的同级节点后先设置默认的样式,然...
高德地图实现一定范围内的关键字搜索

可能你的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 Select添加选择事件,Layui 下拉列表

html<selectname="label"id="atype"lay-filter="atype">
<optionvalue...
vue-element-admin 配置相关, 关闭页面上的设置等

设置在:src目录下的settings.js配置文件,showSettings设置成false即可关闭页面上的设置其他设置module.exports...
Markdown,editormd编辑器Editor.md自动保存插件的开发

简介: Markdown编辑器Editor.md自动保存插件的开发。文章编辑器没有自动保存功能怎么行,万一不小心忘记保存不就...
editormd,Markdown编辑器Editor.md图片粘贴插入插件的开发

Markdown编辑器Editor.md图片粘贴插入的开发。最近发现编辑器图片上传很不方便,不能像其他编辑器一样粘贴插入...
layui表格的简单使用,layui table 数据展示,数据修改,数据更新。layui table的简单使用

前端代码如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta chars...
vue.js 双向绑定简单例子

经典的一个vue.js双向绑定小例子:<!DOCTYPEhtml>
<html>
<head>
<metacharset="u...
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。实现简单的标题。清楚浮动。红黄蓝效果

伪类选择器before和after,实现一个简单的标题效果
代码如下
<!DOCTYPE html>
<html lang="en&...
Easyui datagrid 编辑结束时combobox显示value而不显示text

在调用datgrid编辑结束时
$(‘#dg’).datagrid(‘endEdit’, editIndex);
datagrid的combobox会显示出value,...