vue中的v-if和v-show的区别详解

v-if和v-show的区别是前端面试中常问的基础知识点,v-if、v-show顾名思义就是用来判断视图层展示效果的。那么具体是怎么展示呢?v-if和v-show的区别又是什么呢?首先我们可以来看...

vue实现输入框的模糊查询的示例代码(节流函数的应用场景)

上一篇讲到了javascript的节流函数和防抖函数,那么我们在实际场合中该如何运用呢?首先,我们来理解一下:节流函数首先是节流,就是节约流量、内存的损耗,旨在提升性能,在高频率频发的...

Vue-CLI项目中路由传参的方式详解

一.标签传参方式:<router-link></router-link>第一种router.js{ path: '/course/detail/:pk', name: 'course-detail', component: CourseDetail}传递层<!-- card的内容{...

vue组件命名和props命名代码详解

<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><title>Examples</title><script src="https://cdn.j...

Node.js安装详细步骤教程(Windows版)详解

什么是Node.js?简单的说 Node.js 就是运行在服务端的 JavaScript。Node.js是一个基于 Chrome V8 引擎的 JavaScript 运行环境;Node.js使用一个事件驱动、非阻塞式 I/O 的模型,...

JavaScript页面加载事件实例讲解

一、onload 加载事件onload 是 window 对象的一个事件,也可以省略 window 直接使用。常用方式:<head><script> windown.onload = function() { // 方法体 }</script><head...

Vue使用mixin分发组件的可复用功能

vue创建高阶组件的实现不够react优雅,但那是vue和react的设计思想导致的。在react中一切都是函数,而在vue中,组件最终都是函数,但在开发时可以是JSON对象,而且每个vue组件要注意...

vue中通过使用$attrs实现组件之间的数据传递功能

组件之间传递数据的方式有很多种,之所以有这么多种方式,是为了满足在不同场景不同条件下的使用。一般有三种方式:props
vuex
Vue Event Bus
本文介绍的是使用$attrs的方式。这...

layui 弹出层回调获取弹出层数据的例子

如下所示:// 弹出楼栋负责人信息页面 layer.open({ type: 2, title:'请选择楼栋负责人', maxmin: false, area: ['60%', '80%'], offset: '0px', content: '${...

利用JS响应式修改vue实现页面的input值

前言大部分人在看到这篇文章的标题时第一时间可能有点懵,我先简单介绍一下背景:公司有一个基于Vue实现的登录中心是我负责维护的,页面上是一个常规的登录界面,用户名输入框、密...

layui 选择列表,打勾,点击确定返回数据的例子

如下所示:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/...

layui checkbox默认选中,获取选中值,清空所有选中项的例子

废话不多说,直接上代码吧:var arr = res.data;var myCheckbox = $("input[name='MenuArr']");myCheckbox.prop('checked', false); //切换下拉选项时,清空所有选中状态form.ren...

LayUI动态设置checkbox不显示的解决方法

1.页面引入layui.js和layui.css<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>手机银行权限配置</title> <link type="text/css" rel="stylesheet" href="com...

解决layui checkbox 提交多个值的问题

吐槽一下,layui的checkbox简直就是一个坑...(不能提交数组)数据是从后台来的<div class="layui-form-item" > <label class="layui-form-label">品种</label> <div clas...

Layui多选只有最后一个值的解决方法

在使用Layui的时候,获取checkbox的表单数据,会出现只会获取到最后一个选中的值,不管是将checkbox的name设置成 name[]或name[1] ,name[2]均无效。form.on('submit(add)',functi...

一步一步实现Vue的响应式(对象观测)

平时开发中,Vue的响应式系统让我们不再去操作DOM,只需关心数据逻辑的处理,极大地降低了代码的复杂度。而响应式系统也是Vue的核心,作为开发者有必要了解其实现原理!简易版 以watc...

Vue内部渲染视图的方法

1.什么是虚拟DOM 以前M的命令式操作DOM即使用jQuery操作DOM节点,随着状态的增多,DOM的操作就会越来越频繁,程序的状态也越难维护,现在主流的框架都是采用声明式操作DOM,将操作D...

layui当点击文本框时弹出选择框,显示选择内容的例子

实现如图所示的功能实现步骤:1.html页面需要注意的内容1)、 table<div id="hidden1" lay-filter="hidden1" style="display: none"> <table id="department_result" lay-filt...

详解基于Vue的支持数据双向绑定的select组件

今天用Vue做一个小项目时需要用到多个select筛选功能,但是原生的太丑,如果直接写在当前页多个select处理起来又太繁琐,第三方ui又太大,所以就自己写了一个,并上传了GitHub仓库,仓...

详解element-ui表格中勾选checkbox,高亮当前行

我们在做后台管理系统的时候经常需要操作表格,这里我们要实现的一个功能就是,勾选复选框,高亮显示当前行,也就是当前行样式改变。这是一个非常常见的使用场景,官网给我们提供了一...

layer父页获取弹出层输入框里面的值方法

主要是因为修改功能,原来页面填写数据如图改为其中点击填写明细弹出框填写完毕后点击确认返回,同事这里因为她是存的多表,所以点击确认就直接保存数据了,改的这个功能原本保存是...

Layui 带多选框表格监听事件以及按钮自动点击写法实例

不话不多说了,直接上代码吧:<div class="layui-btn-group demoTable" style="margin: 10px;"> <button class="layui-btn" id="hqsj" data-type="getCheckData">获取选中行数...

浅谈vue限制文本框输入数字的正确姿势

最近遇到一个需求,需要限制文本框输入数字,而number类型的输入框有箭头,个人不是很喜欢,因此想要寻求其它途径实现。本想通过网上找个现成的插件,然而百度,谷歌一番都没有找到满意...

js中比较两个对象是否相同的方法示例

本文实例讲述了js中比较两个对象是否相同的方法。分享给大家供大家参考,具体如下:js中,很轻易就可以比较2个普通字符串/数字是否相同,但是,如何比较2个对象是否相同呢?在此我便给...

layui 数据表格 点击分页按钮 监听事件的实例

找了 很多 关于表格分页 点击事件 请求, table.render 并不支持监听点击事件,所以我就把 table.render 和 laypage.render结合在一起(我也不想写分页的,但是后台讲数据多 ,要加...

微信小程序 云开发模糊查询实现解析

这篇文章主要介绍了微信小程序 云开发模糊查询实现详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下解释:
db.RegExp...

vue-cli随机生成port源码的方法

vue-cli随机生成port源码的方法const portfinder = require('portfinder');const port = await portfinder.getPortPromise();两行代码端口搜索范围默认情况下,portfinder将开...

小程序和web画三角形实现解析

如图:三角形,在很多时候,需要用到,例如tib提示信息,很多都是需要三角形来做辅助效果,在css样式中,代码如下:.Trianglebox{ width: 0px; height: 0px; border-style: solid; bord...

Vue form表单动态添加组件实战案例

今天我们来给大家介绍下在Vue开发中我们经常会碰到的一种需求场景,就是在form中我们需要动态的增加组件模块,效果如下:
这种效果实现其实就是对 v-for 指令的一种使用,组件不是...

layui数据表格跨行自动合并的例子

需求描述:在数据表格中,对于按某个分类展示数据其分类下又有多个细分的嵌套细分项,如省市区昵称,省下面有多个市,市下面有多个区,区下面有昵称,需要实现跨行合并,且操作按钮以分类为...

vue canvas绘制矩形并解决由clearRec带来的闪屏问题

起因:在cavnas绘制矩形时 鼠标移动一直在监测中,所以鼠标移动的轨迹会留下一个个的矩形框,要想清除矩形框官方给出了ctx.clearRect() 但是这样是把整个画布给清空了,因此需要不...

JS实现的碰撞检测与周期移动完整示例

本文实例讲述了JS实现的碰撞检测与周期移动。分享给大家供大家参考,具体如下:<!doctype html><html><head><meta charset="utf-8"><title>无标题文档</title><style type="tex...

vue日历/日程提醒/html5本地缓存功能

先上图功能:1、上拉日历折叠,展示周2、左右滑动切换月2、“今天”回到今天;“+”添加日程3、localStorage存储日程index,html<body>  <div id="app" v-cloak @mousedown="dow...

微信小程序 简易计算器实现代码实例

这篇文章主要介绍了微信小程序 简易计算器实现代码实例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下只能进行简单的...

layui之table checkbox初始化时选中对应选项的方法

这个问题需要后台返回的数据格式跟layui中的示例中返回数据格式一模一样下面是数据格式参考,第一个LAY_CHECKED:true是让checkbox选中的最重要的参数LAY_CHECKED:truecity:"...

layui 动态设置checbox 选中状态的例子

最近在使用layui前端框架,在使用单选按钮、下拉菜单select、checkbox等控件的时候 往往遇到一些初始化的东西。有时候会发现,自己动态append进去的代码要不就是没有显示,要不就...

解决Vue调用springboot接口403跨域问题

最近在做一个前后端分离的项目, 前端用的是Vue后端使用的是springboot, 在项目整合的时候发现前端调用后端接口报错403跨域请求问题前端跨域请求已解决, 那么问题就出在后端...

layui复选框的全选与取消实现方法

废话不多说啦,直接贴上代码吧! <div class="layui-form-item layui-form-text"> <label class="layui-form-label"> <span class="x-red">*</spa...

layui radio点击事件实现input显示和隐藏的例子

如下所示:前端代码<link rel="stylesheet" href="/static/index/layui/css/layui.css" rel="external nofollow" ><script type="text/javascript" src="/static/index/layui...

layui表格分页 记录勾选的实例

layui 分页之后没有记录之前勾选项的功能 , 自己写了一个 , 主要点就是表格的done 函数 ,每次渲染完成之后做表格勾选操作。然后需要一个全局变量记录所有已经勾选的项 。下面...

Layui之table中的radio在切换分页时无法记住选中状态的解决方法

情景描述Layui数据表格中用到了表单元素radio,在当前页面选中radio状态,并同步更新到保存表格中所有的数据的数组中(获取表格中的所有数据并保存到数组中),再点击分页组件中的下...

layui 根据后台数据动态创建下拉框并同时默认选中的实例

第一步 form表单里写好一个下拉框<div class="layui-form-item"> <label class="layui-form-label">下拉选择框</label> <div class="layui-input-block"> <select id="sele...

JS/CSS实现字符串单词首字母大写功能

css实现:text-transform:capitalize;
JS代码一:
String.prototype.firstUpperCase = function(){ return this.replace(/\b(\w)(\w*)/g,function($0,$1,$2){ return $...

利用d3.js实现蜂巢图表带动画效果

以上是效果图,本图表使用d3.js v4制作。图表主要功能是在六边形格子中显示数据,点击底部图标可以切换指定格子高亮显示,图表可以随浏览器任意缩放。1.图表的主体结构是由正六...

JavaScript创建、读取和删除cookie

Cookie 为 Web 应用程序保存用户相关信息提供了一种有用的方法。例如,当用户访问咱们的站点时,可以利用 Cookie 保存用户首选项或其他信息,这样,当用户下次再访问咱们的站点时,应...

element ui分页多选,翻页记忆的实例

先说需求:实时记录当前选中的分页中的列表,分页保存数据,然后在用选中的数据进行某些操作;PS:左下角的数字为记录的当前选中的列表的和直接上可用的代码,前提已配置好各种环境HTM...

Layui Table js 模拟选中checkbox的例子

思路,根据 data-index 找到 点击到的tr,获取tr下的 div,js 模拟点击function iniTable(){ layui.use('table', function(){ var table = layui.table; //展示已知数...

解决Layui中layer报错的问题

问题描述:Uncaught ReferenceError: layer is not defined解决方法,查看网上说名,是非独立版导致直接使用layer导致,只需要在使用时加一说明,申明一下使用。layui.use(['element'...

Layui 动态禁止select下拉的例子

author:咔咔wechat:fangkangfk前端代码js代码// 禁止select点击 function disSelect() { var level = $('#is_level1').val(); if(level != 1){ layer.msg('一级分类...

layui 点击重置按钮, select 并没有被重置的解决方法

如下所示: 点击重置时,输入框被重置为空,而账号 select元素并没有被重置。 // 重置事件 $("#reset").click(function () { $("#searchContent").val(""); $("#selectKey...

返回顶部
顶部