前端
MervynLammm
这个作者很懒,什么都没留下…
展开
-
Vue使用beforeRouteUpdate和beforeRouteLeave解决路由前置钩子需要与实例通信的问题
使用beforeRouteUpdate和beforeRouteLeave解决路由前置钩子需要与实例通信的问题前景提要近期项目有个需求:为了增加用户粘性,增加菜单要可配置成需要登陆后才允许访问的功能。最初的想法:在路由前置钩子中,判断目标路由是否需要登陆,不需要就直接跳转,否则弹出登录对话框。然后问题来了:当初写登录的时候,没有写成一个组件,仅仅是常驻组件header中的一个对话框,通过一个布尔loginFlag判断是否打开对话框。然而,在全局前置钩子中无法访问组件实例this,无法通过事件总线与对话原创 2022-03-29 17:13:00 · 1600 阅读 · 0 评论 -
Vue路由添加公共参数
Vue路由添加公共参数如Vue-Router介绍所说,router.beforeEach是路由跳转前的钩子,需要增加公共参数可以在这里处理。In that case, you must call next exactly once in any given pass through a navigation guard.router.beforeEach中第三个参数next,必须在每一种给定的导航中严格执行一次。执行分两种情况next(),这种情况不再执行前置钩子next('/'),这种情原创 2022-03-25 22:38:32 · 2919 阅读 · 0 评论 -
事件总线,Vue兄弟组件通信、传值
事件总线,Vue兄弟组件通信、传值父子组件在Vue中,父子组件通信、传值是比较方便的。通过$emit和@事件名即可完成通信<!-- 子组件 --><template> <button @click="sendToParent"> 向父组件传值 </button></template><script>export default{ name: 'son', data(){原创 2022-03-25 22:23:44 · 414 阅读 · 0 评论 -
iView upload组件手动上传、图片预览
iView upload组件手动上传、图片预览手动上传iview文档中并没有实际的上传操作实现<Upload ref="upload" :format="['jpg','jpeg','png']" :before-upload="handleUpload" type="drag" :show-upload-list="false" :action="actionUrl" :data原创 2021-10-08 17:43:33 · 2025 阅读 · 0 评论 -
展开、收起过高div
<!DOCTYPE html><html><head> <title></title> <style type="text/css"> .contentDiv { width: 300px; } .hideDiv { display: -webkit-box; -webkit-box-orient.原创 2020-07-29 17:08:05 · 229 阅读 · 0 评论 -
javascript 拖拽调整div大小
<!DOCTYPE html><html><head> <title></title> <style type="text/css"> div { height: 200px; position: absolute; top: 0px; } .right { right: 0原创 2020-07-29 16:46:09 · 832 阅读 · 0 评论 -
jquery动态添加元素
以前写过一篇layui table点击按钮添加、删除一行。今天学习了一种省事的动态添加元素的方法。参考文章:JQuery动态给LayUI table赋值。<table class="layui-table" id="table" lay-filter="table"> <thead> <tr> <td>姓名</td> ...原创 2019-11-25 10:54:23 · 294 阅读 · 0 评论 -
使用tableDnD实现表格拖拽排序功能
今天做项目需要用到拖拽调整排序的功能。做个使用tableDnD插件实现的记录。tableDnD插件Github放个demo代码。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Table拖拽测试</title> <...原创 2019-11-12 16:46:40 · 759 阅读 · 0 评论 -
动态添加的标签,class属性无效(绑定事件不可用)
前面一篇文章提到动态添加、删除一行的实现方法在项目中第一次写动态添加的时候,遇到了一个问题,就是添加的标签,之前绑定的同class事件都失效了,查资料后发现,是绑定事件使用的方法不对,下面说一下。首先是失效情况$('.btn').click(function() { alert('点击了按钮');});可以看到上面我是用.click()的方式绑定事件的,这个方法对动态添加的元...原创 2018-10-21 15:48:36 · 4941 阅读 · 2 评论 -
前端name相同的时候后台获取数据
这篇文章主要是对前端name相同的时候后台获取数据的实现。以添加用户为例。用户实体类public class User{ //用户表字段 private String name; private String age; //为了获取到前端多个name相同的数据,需要有一个装User的List容器 private List<User>...原创 2018-10-21 17:07:52 · 1950 阅读 · 0 评论 -
table、div文字不换行
table{ word-break: keep-all; white-space:nowrap;}word-break:keep-all;//不换行word-break:break-all;//换行white-space:nowrap;//不换行white-space:warp;//换行外层容器添加style="overflow: auto;",使页面滚动...原创 2019-02-14 11:24:34 · 1815 阅读 · 0 评论 -
table添加垂直滚动条
转载用css 给tbody加垂直滚动条思路把tbody设置成display:block,然后就对其高度设置一个固定值,overflow设置成auto。把thead的tr设置成display:block。因为都设置成block所以要给td手动添加宽度<table class="layui-table"> <thead> <tr style="disp...转载 2018-11-27 11:05:47 · 19254 阅读 · 2 评论 -
form表单嵌套、跨表单提交的问题
有时候有表单嵌套、数据跨表单提交的需求。但是<form>标签是不允许嵌套的。要实现跨表单提交要使用form属性。<form id="form1"> <input form="form1" name="name" value="Eric"/> <input form="form1" name="原创 2019-02-14 11:39:43 · 1664 阅读 · 0 评论