230浏览

0评论

多个vue子路由文件自动化合并的方法

1. 目录结构
废话不多说，直接上图。
目录结构，如下图所示2. 代码编写位置
在router目录下面的index.js文件中写入以下代码
import Vue from 'vue'import Router from 'vue-rou...

• 2020-05-27

186浏览

0评论

vue路由教程之静态路由

前言vue的单页面应用是基于路由和组件的，路由用于设定访问路径，并将路径和组件映射起来。传统的页面应用，是用一些超链接来实现页面切换和跳转的。在vue-router单页面应用中，则...

• 2020-05-27

227浏览

0评论

js获取浏览器地址（获取第1个斜杠后的内容）

前言
获取浏览器的地址进行分割，真是再项目中经常用到，这个案例是获取浏览器地址后，获得第一个斜杠后的值,然后用真实域名 拼接截取后的值。这里用到的知识点主要有：正则表达式，...

• 2020-05-27

145浏览

0评论

微信小程序表单验证插件WxValidate的二次封装功能（终极版）

微信小程序表单验证前面的两篇文章做的效果总感觉都有点不太友好，第一篇里的效果是将错误信息通过对话框形式弹出来，这种形式在web形式下早已经淘汰了；第二篇是一次性全部显示...

• 2020-05-27

320浏览

0评论

layui中的switch开关实现方法

效果如下图：显然这个插件是一个checkbox，只是在layui中封装了。所以layui的js和css是必不可少的。Html代码：<form class="layui-form" action=""> <div class="layui-form-item...

• 2020-05-27

186浏览

0评论

Vue使用Clipboard.JS在h5页面中复制内容实例详解

安装clipboard.js
github路径:https://github.com/zenorocha/clipboard.js
安装：
npm install clipboard --save引入clipboard.jsimport ClipboardJS from "clipboard";或<sc...

• 2020-05-27

237浏览

0评论

layui--js控制switch的切换方法

需求：如下所示，当【主键】选择为“T”时，【允许为空】不能选择“T”,且会自动切换为“F”;当【允许为空】选择为“T”时，判断【主键】是否为空，若为“T”，弹出提示，不予更改；首先需...

• 2020-05-27

183浏览

0评论

Layui给switch添加响应事件的例子

今天做项目时，遇到layui中的switch，需要给这个开关添加事件，也就是当你点击是会弹框提示刚开始我用传统的处理方法，直接给它添加个js事件，到最后会发现，没响应，于是我查文档，逛论坛...

• 2020-05-27

140浏览

0评论

mui js控制开关状态、修改switch开关的值方法

修改开关的值 .mui-switch:before{ font-size: 13px; position: absolute; top: 3px; right: 11px; content: attr(data-off); text-transform: uppercase; color: #...

• 2020-05-27

149浏览

0评论

解决mui框架中switch开关通过js控制开或者关状态时小圆点不动的问题

最近开发一个基于mui框架的一个微信小程序，发现在使用mui框架中的switch开关的时候，想要达到联动的功能，让一个主开关控制几个子开关，发现虽然开关的颜色变了，但是开关上的小圆点...

• 2020-05-27

115浏览

0评论

在layui中使用form表单监听ajax异步验证注册的实例

今天给大家介绍的是当下很流行的框架layui中的一个小案例、就是form表单监控提交并且使用ajax异步提交验证数据。在layui中我们想使用哪个模块就要layui.use('form',functio...

• 2020-05-27

136浏览

0评论

简单谈谈javascript高级特性

js中没有class的概念，我们可以使用function来模拟。惰性载入函数例如我们通常使用以下的js代码创建ajax：function createXHR () { var xhr = null; try{ xhr = new XMLHttpRe...

• 2020-05-27

151浏览

0评论

vue本地打开build后生成的dist文件夹index.html问题

1.问题描述：
npm run build 在dist 文件生成了 index 和 static 文件夹，为什么本地打开不了，给后端就能打开？如何才能像访问 npm run dev 的地址那样访问？2.种简单方法
2.1 修改...

• 2020-05-27

194浏览

0评论

关于layui的动态图标不显示的解决方法

1.保证在正确引入layui的CSS和JS后用法如下： <i class="layui-icon layui-icon-loading layui-anim layui-anim-rotate layui-anim-loop" style="display: inline-block"></i...

• 2020-05-27

112浏览

0评论

JSX在render函数中的应用详解

一.JSX简介
const element = <h1>Hello, world!</h1>;JSX 可以很好地描述 UI 应该呈现出它应有交互的本质形式。JSX 可能会使人联想到模版语言，但它具有 JavaScript 的全部功...

• 2020-05-27

138浏览

0评论

解决layer图标icon不加载的问题

之前在项目中使用layer弹框感觉体验很好，这次的项目中就引入了，但是引入之后，弹出层如下图：代码：layer.msg("密码不正确！", {icon:5,time:1000});并没有显示出图标！F12查看才发现如...

• 2020-05-27

137浏览

0评论

vue-loader中引入模板预处理器的实现

vue-loader 是一个 webpack 的 loader，可以将指定格式编写的 Vue 组件转换为 JavaScript模块
同时，vue-loader 支持使用非默认语言，通过设置语言块的lang属性，就可以使用指定的...

• 2020-05-27

175浏览

0评论

使用Angular material主题定义自己的组件库的配色体系

本期为Angular系列的第一篇文章，我会从这里搭建Angular sample项目、组件库、主题、然后每个组件等。使之成为一个比较通用的组件库系列文章，目的有二：1、自己在写系列文章过程...

• 2020-05-27

162浏览

0评论

Element 默认勾选表格 toggleRowSelection的实现

官网尽管提供了toggleRowSelection方法，但没有提供demo实例。
通过了解，结合vue的特殊属性ref引用到Dom元素上，再执行dom上的toggleRowSelection方法。以下通过三种不同的数据...

• 2020-05-27

142浏览

0评论

对layer弹出框中icon数字参数的说明介绍

前言icon参数为0，如下代码：layer.msg('请选择要编辑的机构', {icon: 0});运行结果如图： icon参数为1，如下图icon参数为2，如下图：icon参数为3，如下图：icon参数为4，如下图：icon参数为5，如...

• 2020-05-27

201浏览

0评论

解决layui 表单元素radio不显示渲染的问题

最近一直在使用layui，一个对程序员相对友好的前端框架，很多效果都进行了初步的封装。在使用过程中遇到最多的问题就是引用的问题，各种模板无法使用，虽然都一一百度解决。本次需...

• 2020-05-27

167浏览

0评论

layui 表单标签的校验方法

layui表单元素的校验只需在元素上加入lay-verify，layui提供了以下值。required（必填项）phone（手机号）email（邮箱）url（网址）number（数字）date（日期）identity（身份证）自定义值同时支持多条规...

• 2020-05-27

159浏览

0评论

layerui代码控制tab选项卡,添加,关闭的实例

废话不多说，直接上代码吧！<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>layui</title> <meta name="renderer" content="webkit"> <meta http-equiv="X-UA-Com...

• 2020-05-27

179浏览

0评论

微信小程序官方动态自定义底部tabBar的例子

最近在做小程序的项目，由于用户需求在进入页面时进行选则角色，然后再进入小程序，这时看到的底部菜单看到的不一样，而我们都知道原生的tabBar是不支持这种做法的。在网上搜集了海...

• 2020-05-27

121浏览

0评论

Layui 导航默认展开和菜单栏选中高亮设置的方法

如下所示：<ul class="layui-nav layui-nav-tree custom-nav-tree" lay-filter="kitNavbar" kit-navbar> <c:if test="${title_sys eq '内容管理' }"> <li class="la...

• 2020-05-27

134浏览

0评论

layui实现tab的添加拒绝重复的方法

layui中tab的添加：重复添加，没有自动跳转肯定让你烦了很久吧，我也是花了很久才解决的前提是这样的：我点击不同按钮生成对应tab，而且再点击前已经有一个tab了（比如说：‘首页‘，个人需...

• 2020-05-27

127浏览

0评论

微信小程序实现点击卡片 翻转效果

动画效果： wxml:<view class='main'> <!--正面的框 --> <view class="box b1" animation="{{animationMain}}" bindtap='rotateFn' data-id="1" > <image src=""></imag...

• 2020-05-27

168浏览

0评论

微信小程序按钮点击动画效果的实现

动画效果如下：GIF看起来可能会有点卡wxml<view class="confirm bubble">确定</view>wxss.confirm{ width: 325rpx; height: 80rpx; background: #07c160; border-radius: 6rp...

• 2020-05-27

214浏览

0评论

微信自定义分享链接信息（标题，图片和内容）实现过程详解

网页分享到微信要怎么才能自定义标题，内容和图片呢？
需求概述
微信中可以直接转发网页链接，用户在微信内置浏览器中打开后可以通过微信浏览器中右上角进行分享到朋友，朋友圈，QQ等...

• 2020-05-27

161浏览

0评论

在layui tab控件中载入外部html页面的方法

目前，潜入外部网页的方式，主要有3种：iframe方式<div><iframe src="xxx.jsp"></iframe>ajax方式<div id=“externalHtml"></div>ajax加载数据后，直接赋予 externalHtml.innerHTML...

• 2020-05-27

116浏览

0评论

layui弹出框Tab选项卡的示例代码

最近做一个项目，使用LAYUI，在界面上Z弹出一个界面A，A上有TAB选项卡，分别为界面B、C；B界面上有一个列表，双击败列表行时，要把数据回写到界面Z; 界面A上有提交按钮，选中B界面上列表某...

• 2020-05-27

112浏览

0评论

微信小程序 自定义复选框实现代码实例

功能：　1、需要多选复选框，并且可以上拉滚动；2、需要通过名称手写字母排序的，并且可以上拉滚动；常规的小程序自带的原生picker无法满足我们的要求，因此一些特殊效果需要我们自定义...

• 2020-05-27

134浏览

0评论

layui使用button按钮 点击出现弹层 弹层中加载表单的实例

1.html代码片段<div class="layui-input-inline"> <button type="button" οnclick="selectRole()" class="layui-btn layui-btn-primary layui-btn-radius">选择角...

• 2020-05-27

128浏览

0评论

webpack 如何解析代码模块路径的实现

前言webpack是如何解析代码模块路径webpack 中有一个很关键的模块 enhanced-resolve 就是处理依赖模块路径的解析的，这个模块可以说是 Node.js 那一套模块路径解析的增强版本...

• 2020-05-27

196浏览

0评论

深入浅出vue图片路径的实现

基础
1.webpack打包本质
本质就是nodejs去执行webpack脚本，由webpack脚本对项目各个文件进行必要的编译(通俗而言即字符串处理)，再输出到某个目录
2.import from 和require
we...

• 2020-05-27

170浏览

0评论

微信小程序JS加载esmap地图的实例详解

一、在微信小程序里显示室内三维地图 需要满足的两个条件调用ESMap室内地图需要用到小程序web-view组件，想要通过 web-view 调用ESMap室内地图需要满足以下 2 个条件：1. 小程...

• 2020-05-27

197浏览

0评论

微信小程序tab切换可滑动切换导航栏跟随滚动实现代码

简介看到今日头条小程序页面可以滑动切换，而且tab导航条也会跟着滚动，点击tab导航，页面滑动，切导航栏也会跟着滚动，就想着要怎么实现这个功能像商城类商品类目如果做成左右滑动切...

• 2020-05-27

270浏览

0评论

解决layui数据表格table的横向滚动条显示问题

加上这段样式代码就可以解决了：<link type="text/css" rel="stylesheet" href="layui/css/layui.css" rel="external nofollow" /><style> body{overflow-y: scroll;} /* 禁...

• 2020-05-27

132浏览

0评论

解决layui表格的表头不滚动的问题

步奏：1、设置两个table，第一个table有thead没有tbody，第二个table有tbody没有table；2、第二个table需要一个div包住，并设置宽高，可用绝对布局3、tr下的th和td需要设置相同的宽度实...

• 2020-05-27

127浏览

0评论

Layui 数据表格批量删除和多条件搜索的实例

layui数据表格批量删除多条件搜索框：注样式自己写<div class="demoTable" style="width: 968px; margin:20px auto;color: #7185a2"> 流水号： <div class="layui-inline...

• 2020-05-27

85浏览

0评论

Vue实现商品详情页的评价列表功能

本篇我们来实现商品详情页的评价列表。 必要的数据这里咱们举一个数据的例子，明明白白地了解这些数据是如何绑定到模板中的。数据来自于Foods父组件，当我们选中商品，跳转到商品...

• 2020-05-27

131浏览

0评论

layui table数据修改的回显方法

实现的样式给你们看一波点击这锅按钮其实回显就是一个赋值的操作，先把form表单的那些input 框的id拿到，在展示成功的那里进行绑值 table.on('tool(test)', function(obj) { va...

• 2020-05-27

148浏览

0评论

layui-table对返回的数据进行转变显示的实例

在使用layui表格时，在ajax请求回来的数据，有时候需要我们处理之后显示1.比如性别sex这个字段，后台可能返回的是1.或者 2；那我们总不能显示1.和 2，我们需要显示男和女，这里就用到了...

• 2020-05-27

133浏览

0评论

layui 对弹窗 form表单赋值的实现方法

目的： 点击编辑按钮 实现 数据回显到弹出 子页面 表单 内。如下图：Html 代码：<body> <div class="layui-form" lay-filter="useradmin" id="useradmin"> <div class="layui-fo...

• 2020-05-27

114浏览

0评论

Vue 动态路由的实现及 Springsecurity 按钮级别的权限控制

思路 ：动态路由实现:在导航守卫中判断用户是否有用户信息， 通过调用接口，拿到后台根据用户角色生成的菜单树， 格式化菜单树结构信息并递归生成层级路由表并 使用Vuex保存，通过 r...

• 2020-05-27

161浏览

0评论

vue中如何实现后台管理系统的权限控制的方法步骤

一、前言在广告机项目中，角色的权限管理是卡了挺久的一个难点。首先我们确定的权限控制分为两大部分，其中根据粒的大小分的更细： 接口访问的权限控制 页面的权限控制 菜...

• 2020-05-27

134浏览

0评论

layui 实现table翻页滚动条位置保持不变的例子

最近使用了layui table但是发现了一系列问题，由于被封装过不好自己修改，比如翻页后滑动条每次都会复位，导致体验不好，通过调试，我发现layui table并没有给div加id标签，我通过class...

• 2020-05-27

177浏览

0评论

javascript之分片上传，断点续传的实际项目实现详解

总所周知，上传大文件时由于各种原因突然中断，然后整个文件需要从头开始上传，这种情况非常令人抓狂&#63;&#63;，那么怎样才可以避免这种尴尬的情况呢？分片上传或许可以搞定这个痛点...

• 2020-05-27

178浏览

0评论

利用d3.js制作连线动画图与编辑器的方法实例

连线动画图编辑器
效果如上图所示。
本项目使用主要d3.jsv4制作，分两部分，一个是实际展示的连线动画图，另一个是管理人员使用鼠标编辑连线的页面。对于d3.js如何引入图片，如何画...

• 2020-05-27

144浏览

0评论

BootStrap表单验证中的非Submit类型按钮点击时触发验证的坑

BootStrapValidator表单验证插件的坑还真不少，又让我碰上一个...BootStrapValidator验证的表单中只可有一个 type="submit" 的按钮。 我这样写了之后 （代码如下） ，点击其它按钮...

• 2020-05-27