本文主要分享关于组件化开发的理解,让刚入门的小伙伴少走一些弯路,提高开发效率,作者本人也是新手,如有不当之处,请大佬指出,感谢。
相信很多刚入门的小伙伴,经常会写很多重复的代码,而这些代码一般情况下也都是大同小异,在这种情况下,如何让开发和学习变得更加高效,组件化的思想就显得尤为重要。这里通过设计一个简单的弹出框,给小伙伴们分享组件化的应用。
组件&组件化
组件化是对某些可以进行复用的功能进行封装的标准化工作。组件一般会内含自身的内部UI元素、样式和JS逻辑代码,它可以很方便的在应用的任何地方进行快速的嵌入。组件内部可以使用其他组件来构成更复杂的组件。
在实际的开发中,我们应该避免去编写重复的代码,将精力放在更加核心的部分,因此就需要将这些重复的代码抽取出来,封装成公共的组件,提高开发效率,但同时也要注意组件的健壮性和可复用性,让它能够尽可能适应更多的场景。
基本结构
首先是弹出框的基本结构
基本结构很简单,稍微注意一点的就是 slot 插槽,如果没有提供name属性,它将有一个隐含的名字default,并且在父组件如果没有指定 slot 的 v-slot 属性的话,内容会传给default插槽。
在这里定义了 slot 的name属性 body ,这种的叫做具名插槽,会匹配 v-slot:body 的内容。
注意,在父组件中调用需要用 包裹,并且 元素中的所有内容都将被传入相应的插槽。
给弹出框加点样式
.modal {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
.mask {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #000000;
opacity: 0.5;
}
.modal-dialog {
position: absolute;
top: 40%;
left: 50%;
width: 560px;
height: auto;
background-color: #ffffff;
transform: translate(-50%, -50%);
.modal-header {
height: 60px;
background-color: #F5F5F5;
padding: 0 25px;
line-height: 60px;
font-size: 16px;
.icon-close {
position: absolute;
top: 23px;
right: 25px;
width: 14px;
height: 14px;
background: url("/static/img/icon-close.png") no-repeat center;
background-size: contain;
}
}
.modal-body {
padding: 42px 40px 54px;
font-size: 14px;
}
.modal-footer {
height: 82px;
line-height: 82px;
text-align: center;
background-color: #F5F5F5;
}
}
}
我这里使用的是 scss ,使用的时候别忘了安装 node-sass 和 sass-loader ,现在我们的页面是这个样子了
虽然还是不太美观,但是已经基本上是一个弹出框的雏形了,并且我没有给 a 标记样式,原因在后面。
SCSS函数
回过头再看看上面的 css 代码,这里重复写了4次固定定位的代码,而且随着项目的推进,肯定还有更多类似的代码,何不将这些部分抽取出来,进行封装呢? scss 提供了这个功能,将 css 封装成函数,这里的函数直接会返回函数体。我们在遇到类似的情况时,就能够直接复用。
在 assets 目录下新建 scss 文件夹并在里面新建 mixin.scss ,在里面新建 position 函数,代码如下:
@mixin position($pos: absolute, $top: 0, $left: 0, $w: 100%, $h: 100%) {
position: $pos;
top: $top;
left: $left;
width: $w;
height: $h;
}
接着我们引入 mixin.scss ,用 position 函数替换我们原先的代码
通过@include方式使用 scss 函数: @include position(fixed); 括号里面的是参数。
关于按钮
每一个网站都有很多按钮,不过,同一个网站的按钮风格大多都是一样,无非是大小不一。因此可以单独在 scss 文件下新建 button.scss 然后在 App.vue 里面引入这个文件,在后面除了一些特别的样式,其它就不需要给按钮定义样式了,这样也便于维护。这里给出我的 button 文件,可以参考一下。
.btn {
display: inline-block;
width: 110px;
line-height: 30px;
text-align: center;
background-color: #FF6600;
color: #ffffff;
border: none;
cursor: pointer;
}
.btn-default {
background-color: #b0b0b0;
color: #d7d7d7;
}
.btn-large {
width: 202px;
height: 50px;
line-height: 50px;
font-size: 18px;
}
.btn-huge {
width: 300px;
height: 54px;
line-height: 54px;
font-size: 16px;
}
.btn-group {
.btn {
margin-right: 20px;
&:last-child {
margin-right: 0;
}
}
}
为了复用
当前这个弹出框还只是一个固定的结构,它并不能在其他地方复用,需要进行一些处理,将所有可变部分抽取出来,例如标题,按钮,内容。因为有插槽,所以内容就不用考虑,需要关注的是标题和按钮,因为标题有可能是提示,警告等等,按钮也有可能是确定、取消的一个或两个都有。而这些信息都是从父组件传递过来,需要用 props 接收。
在 props 里面添加如下代码,并给某些属性指定默认值:
props: {
// 弹框标题
title: String,
// 按钮类型: 1:确定按钮 2:取消按钮 3:确定取消
btnType: String,
// 按钮文本
sureText: {
type: String,
default: "确定"
},
cancleText: {
type: String,
default: "取消"
},
showModal: Boolean
}
添加完之后,还需重新改写代码
通过父组件传递的参数,来实现代码的重用,并且使用 $emit 来向外抛出自定义事件,然后在父组件实现自己的业务逻辑。
在 Home.vue 里面引入这个组件并调用
这里的 @submit 和 @cancle 就是我们在组件里面自定义的事件
最终效果如下
实现完之后,感觉有点弹出时生硬,没关系,我们给它加点动画,在css3中有 transform 和 transition 可以实现动画效果,但是我们这里使用 vue 内置组件 ,让弹出框有一个从上面弹出的效果。
transition组件
transition 组件可以为元素或组件添加过渡效果,只会把过渡效果应用到其包裹的内容上,而不会额外渲染 DOM 元素,也不会出现在可被检查的组件层级中。它可以通过多种方式进行过渡,在这里应用 class的方式过渡。
这幅图是 Vue 官方给出的图,简单来说,v-enter是动画开始的状态,v-enter-active进入过渡生效时的状态,v-enter-to是过渡的结束状态,leave同理,具体细节大家可以去 https://cn.vuejs.org/v2/guide/transitions.html查看。
当没有指定的name属性时,过渡的类名会默认以v作为前缀,这里给transition指定name为
slide并用它包裹modal组件
在style代码里面modal后面加上
&.slide-enter-active {
top: 0;
}
&.slide-leave-active {
top: -100%;
}
&.slide-enter {
top: -100%;
}
并且给modal指定需要过渡的属性
加完这个之后,弹出框就会有一个滑上滑下的动画啦。
到此,我们的弹出框就完成啦。
你也可以根据自己的需求去做适当的调整,开发出适合自己项目的弹出框。
最后
在实际开发中,组件化是尤为重要的,它能够帮助我们写出更高质量的代码,也能够让我们的代码更易于维护,尽早的树立组件化的思想,对写代码也是非常有帮助的。
附上https://github.com/anpeier/shop-online
到此这篇关于Vue组件化开发之通用型弹出框的实现的文章就介绍到这了,更多相关Vue 弹出框内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!
你可能感兴趣的:(Vue组件化开发之通用型弹出框的实现)
分享一个使用的音频裁剪chrome扩展-Ringtone Maker
blogcs
音视频 chrome 前端
一、插件简介铃声制作器是一个简单易用的Chrome扩展,专门用于制作手机铃声。它支持裁剪音频文件的特定片段,并将其下载为WAV格式,方便我们在手机上使用。无论是想从一段长音频中截取精彩部分作为铃声,还是对现有的音频进行个性化剪辑,这个插件都能轻松满足你的需求二、安装方法安装这个插件非常方便,有两种方式可供选择:1.从Chrome网上应用店安装访问Chrome网上应用店页面。点击“添加到Chrome
土壤分析:土壤养分分析_(14).土壤养分与植物生长的关系
zhubeibei168
农业检测 opencv 人工智能 计算机视觉 无人机 图像处理 农业检测
土壤养分与植物生长的关系引言土壤养分是植物生长发育的必要条件之一。植物通过根系从土壤中吸收养分,这些养分对于植物的光合作用、细胞分裂、蛋白质合成等生理过程至关重要。因此,了解土壤养分与植物生长的关系对于提高作物产量、优化土壤管理具有重要意义。本节将详细介绍土壤养分的主要成分、植物对这些养分的需求以及如何通过计算机视觉技术来分析土壤养分与植物生长的关系。土壤养分的主要成分土壤养分主要包括以下几类:宏
深度解析DeepSeek大模型的技术架构与创新点
程序员
大家好,我是一名DeepSeek大模型研究者,今天我想和大家分享一下DeepSeek大模型的核心技术架构和创新特点。作为国内领先的开源大模型,DeepSeek在架构设计和技术创新上都有其独特之处。让我们一起来揭开它的神秘面纱!一、基础架构概览DeepSeek的核心架构建立在Transformer的基础上,但进行了多项创新优化。我第一次接触DeepSeek时,就被它在模型结构上的精巧设计所吸引。1.
Html、Markdown的信息提取
DreamBoy_W.W.Y
知识图谱 python
目录一、前言二、核心代码1、解析提取html文档2、提取Markdown文档信息一、前言【python】mistune转换md为HTML,BeautifulSoup解析读取。【python】Html文档,使用BeautifulSoup解析读取。二、核心代码1、解析提取html文档defextract_all_content(soup):content={'text':[]
css块级元素和行内元素区别
serve the people
日常琐问 css 前端
在CSS中,元素可以分为两大类:块级元素(Block-levelelements)和行内元素(Inlineelements)。这两种元素在网页布局中起着不同的作用,主要体现在它们的显示方式、尺寸控制、以及与其他元素的交互方式上。块级元素(Block-levelelements)特点:独占一行:块级元素会独占一行,在其前后会自动添加换行符。可设置宽度和高度:可以设置width和height属性来改变
TypeScript 面试题
花铛
面试
对类型声明和类型检测的认识:在TypeScript中,通过类型声明来指定变量的类型;指定类型后,当为变量赋值时,TS编译器会自动进行类型检测,检查值是否符合指定的类型,符合则赋值,否则报错。对类型推断的认识:在声明一个变量时,如果有直接赋值,TypeScript会根据值的类型推断出类型注解,这就是类型推断。对类型断言的认识:类型断言:可以用来手动指定一个值的类型。语法为值as类型或者值。TypeS
【MediaTek】 T750 openwrt-23.05编译: error: ISO C++17 does not allow dynamic exception specifications
wellnw
功能实现及问题处理 Openwrt openwrt
MediaTekT750T750采用先进的7nm制程,高度集成5G调制解调器和四核ArmCPU,提供较强的功能和配置,设备制造商得以打造精巧的高性能CPE产品,如固定无线接入(FWA)路由器和移动热点。MediaTekT750平台是一款综合的芯片组,集成了5GSoCMT6890、12nm制程的收发器MT6190、ET、GNSS和PMIC等。高度集成的T750平台大幅减少组件数量,为产品设计者提供更
openwrt 桥模式下ebtables转发所有流量到三层,导致DHCP无法获取IP解决方案
wellnw
Openwrt
需求需要统计桥模式下的终端设备流量解决方案使用ebtables将二层流量转到三层然后处理,使用以下指令实现ebtables-tbroute-ABROUTING-pipv4-jredirect出现问题桥模式下接入的设备无法获取到IP地址问题分析由于插入的路由规则将所有流量转发到三层,导致DHCP数据无法正常交互解决方案ebtables-tbroute-IBROUTING-pipv4--ip-prot
openwrt 修改路由ttl值
wellnw
Openwrt
修改路由器的ttl值iptables-tmangle-IPOSTROUTING1-jTTL--ttl-set65
5G应用创新发展策略研究
米朵儿技术屋
计算机科学及电子科技技术专栏 5G
【摘要】我国高度重视5G产业发展,积极推进5G赋能垂直行业数字化转型,5G应用发展环境不断完善,5G应用进入加速导入期。主要分析了5G应用发展环境、国内外现状以及产业融合应用发展存在的问题,并给予产业应用创新发展相关建议,推动网络快速部署,加速行业数字化转型升级,实现数字经济社会新变革。【关键词】5G;融合应用;智简网络15G应用发展环境目前全球5G商用发展已初具规模,为5G应用的规模落地和创新发
Python实战:解析labelme标注数据——如何将数据转换为COCO格式
程序员杨弋
Python全栈工程师学习指南 python 开发语言
在计算机视觉中,标注数据是非常重要的,而Labelme是一个简单易用的自由标注工具,被广泛应用于图像语义分割、目标检测、实例分割等领域,然而标注数据并不总是以我们需要的格式存在,因此需要进行适当的转换,本文将详细介绍如何将Labelme标注数据转换为COCO格式。首先需要安装相关的Python库,包括labelme、numpy、matplotlib、pillow等,在安装完成后设置数据路径,并读取
论基于UML的需求分析(系统架构师2024新版)
桃花键神
uml 需求分析 系统架构
声明文章前部分范文来自网络搜集,后部分写作指导、写作建议来自原创。如有侵权联系删除摘要:2021年3月1日至12月20日,我参加了“数据安全访问平台”项目的开发,担任系统分析员的工作。该项目是某行业用户“数据中心二期”建设的主要内容,目标是:建立数据统一访问接口及其使用标准,规范、约束和审计数据应用访问数据库的行为,对数据应用提供强制审计的技术手段。由于该系统是所有应用的基础平台,对系统的可靠性与
从文化到实践:DevOps的基本概念与核心实践详解
Echo_Wish
运维探秘 让你快速入坑运维 devops 运维 linux
一、引言:什么是DevOps?在当前快速发展的IT世界中,开发与运维之间的协作显得越来越重要。传统软件开发和运维模式的“隔离”导致了沟通不畅和效率低下,而DevOps应运而生,旨在通过文化和工具的结合,将开发(Development)与运维(Operations)之间的隔阂打破。DevOps不仅是一套技术和工具,更是一种文化、一种思维方式,能够帮助组织更高效、持续地交付高质量的软件。二、DevOp
no matching cipher found问题一次解决经历
一张假钞
linux
Hadoop 的分布式缓存机制是如何实现的?如何在大规模集群中优化缓存性能?
晚夜微雨问海棠呀
分布式 hadoop 缓存
Hadoop的分布式缓存机制是一种用于在MapReduce任务中高效分发和访问文件的机制。通过分布式缓存,用户可以将小文件(如配置文件、字典文件等)分发到各个计算节点,从而提高任务的执行效率。分布式缓存的工作原理文件上传:用户将需要缓存的文件上传到HDFS(HadoopDistributedFileSystem)。文件路径可以在作业配置中指定。作业提交:在提交MapReduce作业时,用户可以通过
农业土壤传感器可根据作物周期调整采集频率
百态老人
人工智能 大数据 算法
农业土壤传感器确实可以根据作物生长周期动态调整数据采集频率,这一功能主要通过先进的智能算法与传感器技术的深度融合实现。根据的描述,DeepSeek技术能够根据实际需求动态调整传感器的工作模式。例如,在农业物联网场景中,土壤传感器可以结合作物不同生长阶段的需求,灵活调节数据采集频率。这种动态调整不仅能保证监测数据的时效性,还能有效降低传感器能耗,延长电池寿命。具体来说,作物从萌芽期到成熟期对土壤参数
钢铁行业设备智能运维实战:基于DuodooBMS+SKF的减速机全生命周期管理方案
邹工转型手札
风吟九宵 企业信息化 Duodoo开源 运维 数据库 人工智能 制造 开源
(导语:在钢铁行业"设备即产能"的竞争格局下,某大型钢铁集团通过DuodooBMS+SKFObseverPhoenixAPI系统实现核心设备预测性维护,热轧产线非计划停机减少42%,设备综合效率OEE提升17%)一、钢铁企业设备管理之痛某年产800万吨的钢铁联合企业热轧车间,12台关键减速机连续发生异常磨损事故:2023年Q1因1#摆剪减速机轴承失效导致非计划停机23小时,直接损失超200万元传统
从数据到情感:全维度解析哪吒2的212亿票房之战
数据分析
综合目前的数据来看,我分析一下哪吒2的最终票房和冲击第一名可能性。当前态势:票房现状说明目前票房:110亿国内贡献:90%以上(约108亿)海外表现:仅2300万已上映:春节档15天左右三条预测路径分析(含日均计算)A.基础预测线(160-170亿)目标缺口:50-60亿时间周期:45天具体路径:第一阶段(15天)日均要求:2亿阶段贡献:30亿工作日表现:1.5亿/天周末表现:3亿/天第二阶段(1
/etc/profile、/etc/bashrc、~/.bash_profile、~/.bashrc的区别
u014093837
linux
/etc/profile:此文件为系统的每个用户设置环境信息,当用户第一次登录时,该文件被执行.并从/etc/profile.d目录的配置文件中搜集shell的设置./etc/bashrc:为每一个运行bashshell的用户执行此文件.当bashshell被打开时,该文件被读取.~/.bash_profile:每个用户都可使用该文件输入专用于自己使用的shell信息,当用户登录时,该文件仅仅执行
揭秘!100 个 Python 常用易错知识点的避坑指南
tekin
Python python Python 易错点 Python 编程避坑 Python 知识总结 Python 基础与进阶 Python 代码优化 Python 常见错误解析
目录简介1.类方法命名中的下划线2.函数形参中的*和**3.函数实参中的*4.变量作用域5.浅拷贝和深拷贝6.默认参数的陷阱7.迭代器和生成器相关迭代器使用后耗尽生成器表达式和列表推导式混淆8.异常处理相关捕获异常范围过大异常处理中的finally子句9.多线程和多进程相关全局解释器锁(GIL)误解多线程性能提升多进程中的资源共享问题10.字符串编码问题编码和解码错误11.模块导入相关循环导入问题
角色访问控制(RBAC)
IT源哥
架构设计和软件设计 user session actor uml access class
角色访问控制(RBAC)引入了Role的概念,目的是为了隔离User(即动作主体,Subject)与Privilege(权限,表示对Resource的一个操作,即Operation+Resource)。Role作为一个用户(User)与权限(Privilege)的代理层,解耦了权限和用户的关系,所有的授权应该给予Role而不是直接给User或Group。Privilege是权限颗粒,由Operat
Java学习教程,从入门到精通,Java 正则表达式知识点及案例代码(120)
知识分享小能手
编程语言如门 Java 大数据 java 学习 正则表达式 jdbc 开发语言 数据库 java后端开发
Java正则表达式知识点及案例代码一、正则表达式简介正则表达式(RegularExpression,简称regex)是一种用于描述字符串模式的强大工具。它可以用来进行字符串的匹配、查找、替换等操作。Java提供了java.util.regex包来支持正则表达式。二、Java正则表达式语法1.基本语法元字符描述.匹配除换行符以外的任意字符\d匹配数字,等价于[0-9]\D匹配非数字,等价于[^0-9
CSS 核心技术知识点详解:从基础到进阶
秋水为渡
前端 css
本文基于图中提供的17个CSS核心知识点展开讲解,涵盖基础概念、布局原理、实战技巧及性能优化等内容。每个知识点均附代码示例和原理分析,帮助读者系统性掌握CSS核心能力。1.选择器作用:定位HTML元素并应用样式。常见类型:类选择器:.class-name{...}ID选择器:#id-name{...}属性选择器:[type="text"]{...}代码示例:.button{color:red;}/
红队视角出发的k8s敏感信息收集——持久化存储与数据泄露
周周的奇妙编程
kubernetes 容器 云原生
在Kubernetes集群中,持久化存储卷如同数据的保险箱,承载着应用运行所必需的各类敏感信息。然而,从红队视角出发,这些存储卷也可能成为攻击者觊觎的目标。通过巧妙地利用配置不当或已知漏洞,攻击者能够从中收集到包括密钥、访问凭证在内的大量敏感数据,进而导致数据泄露事件的发生。攻击链示例:攻击者通过容器逃逸进入Pod→发现挂载的EBS卷并创建快照→共享快照至攻击者AWS账户→还原快照窃取数据库凭据→
pdsh 2.29 源码编译安装教程
云墨丹青
windows ssh
pdsh2.29源码编译安装教程简介pdsh(ParallelDistributedShell)是一个高效的多服务器并行shell命令执行工具。本文将详细介绍如何从源码编译安装pdsh2.29版本。环境要求Linux操作系统gcc编译器make工具足够的磁盘空间(建议至少1GB可用空间)安装步骤1.下载源码包首先,下载pdsh2.29的源码包:wgethttps://storage.googlea
网络原理之HTTP协议,及理解Cookie和Session的区别
qq_41603622
网络 http cookie session https
文章目录一、HTTP原理简介二、HTTP内容简介1.认识URL2.HTTP协议格式3.HTTP的方法4.HTTP的状态码通过Fiddler抓包工具分析请求和响应的格式5.HTTP常见Header6.Cookie和Session的简单介绍三、补充1.HttpVSHttps提示:以下是本篇文章正文内容一、HTTP原理简介 HTTP协议(超文本传输协议HyperTextTransferProtocol
labelme转YOLOv8、YOLOv5 标签格式 标注数据
一颗小树x
YOLO目标检测 实践应用 labelme YOLOv8 YOLOv5 标签格式 标注数据
前言本文分析将labelme的标签,转为YOLOv8、YOLOv5的格式,实现模型训练。首先了解YOLOv8和YOLOv5标签格式,然后了解labelme标签格式,最近实现数据格式转换。1、YOLOv8和YOLOv5标签格式YOLOv8的标签格式与YOLOv5基本相同,使用一种简单的txt文本格式,来存储每个图像的标注数据。每个图像对应一个文本文件,这些文本文件与图像文件位于同一目录并且具有相同的
探索Java设计模式:建造者模式
放码过来_
设计模式 java 设计模式 建造者模式
探索Java设计模式:深入理解与实践建造者模式在软件工程中,设计模式为解决常见的编程问题提供了最佳实践。本文将聚焦于Java编程语言中的建造者模式(BuilderPattern),通过简要介绍、实现示例及实际运用等模块,帮助读者深入理解并有效运用这一模式。一、简要介绍**建造者模式(BuilderPattern)**是一种创建型设计模式,它将一个复杂对象的构建过程与其表示相分离,使得同样的构建过程
交换机测试内容有哪些
network_tester
交换机测试 测试工具 信息与通信 网络协议 网络 tcp/ip 网络安全 信号处理
交换机测试是确保其性能、功能和可靠性的关键步骤,通常包括以下内容:1.功能测试验证交换机的基本功能是否正常工作:MAC地址学习:检查交换机是否能正确学习和更新MAC地址表。VLAN功能:VLAN划分和隔离。Trunk端口(802.1Q)的VLAN标签处理。链路聚合(LACP):测试端口聚合功能是否正常。生成树协议(STP/RSTP/MSTP):验证环路避免和链路冗余功能。广播/组播控制:检查广播风
矢量网络分析仪测量相位的步骤
network_tester
矢量网络分析仪 测试工具 信息与通信 网络 负载均衡 压力测试 信号处理 网络协议
使用矢量网络分析仪测量相位的步骤通常包括以下几个方面:一、准备工作安装与连接:确保矢量网络分析仪已经正确安装,并连接到电脑。同时,安装最新的驱动程序和测量软件,保证仪器与电脑的通信正常。校准仪器:在进行相位测量之前,对矢量网络分析仪进行校准,以确保测量的准确性和精度。校准过程中,可以使用已知相位响应的标准件来消除系统误差。设置测量参数:根据待测信号的类型和频率范围,配置合适的测量参数,如起始频率、
java线程的无限循环和退出
3213213333332132
java
最近想写一个游戏,然后碰到有关线程的问题,网上查了好多资料都没满足。
突然想起了前段时间看的有关线程的视频,于是信手拈来写了一个线程的代码片段。
希望帮助刚学java线程的童鞋
package thread;
import java.text.SimpleDateFormat;
import java.util.Calendar;
import java.util.Date
tomcat 容器
BlueSkator
tomcat Web servlet
Tomcat的组成部分 1、server
A Server element represents the entire Catalina servlet container. (Singleton) 2、service
service包括多个connector以及一个engine,其职责为处理由connector获得的客户请求。
3、connector
一个connector
php递归,静态变量,匿名函数使用
dcj3sjt126com
PHP 递归函数 匿名函数 静态变量 引用传参
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Current To-Do List</title>
</head>
<body>
属性颜色字体变化
周华华
JavaScript
function changSize(className){
var diva=byId("fot")
diva.className=className;
}
</script>
<style type="text/css">
.max{
background: #900;
color:#039;
将properties内容放置到map中
g21121
properties
代码比较简单:
private static Map<Object, Object> map;
private static Properties p;
static {
//读取properties文件
InputStream is = XXX.class.getClassLoader().getResourceAsStream("xxx.properti
[简单]拼接字符串
53873039oycg
字符串
工作中遇到需要从Map里面取值拼接字符串的情况,自己写了个,不是很好,欢迎提出更优雅的写法,代码如下:
import java.util.HashMap;
import java.uti
Struts2学习
云端月影
最近开始关注struts2的新特性,从这个版本开始,Struts开始使用convention-plugin代替codebehind-plugin来实现struts的零配置。
配置文件精简了,的确是简便了开发过程,但是,我们熟悉的配置突然disappear了,真是一下很不适应。跟着潮流走吧,看看该怎样来搞定convention-plugin。
使用Convention插件,你需要将其JAR文件放
Java新手入门的30个基本概念二
aijuans
java 新手 java 入门
基本概念: 1.OOP中唯一关系的是对象的接口是什么,就像计算机的销售商她不管电源内部结构是怎样的,他只关系能否给你提供电就行了,也就是只要知道can or not而不是how and why.所有的程序是由一定的属性和行为对象组成的,不同的对象的访问通过函数调用来完成,对象间所有的交流都是通过方法调用,通过对封装对象数据,很大限度上提高复用率。 2.OOP中最重要的思想是类,类是模板是蓝图,
jedis 简单使用
antlove
java redis cache command jedis
jedis.RedisOperationCollection.java
package jedis;
import org.apache.log4j.Logger;
import redis.clients.jedis.Jedis;
import java.util.List;
import java.util.Map;
import java.util.Set;
pub
PL/SQL的函数和包体的基础
百合不是茶
PL/SQL编程函数 包体显示包的具体数据 包
由于明天举要上课,所以刚刚将代码敲了一遍PL/SQL的函数和包体的实现(单例模式过几天好好的总结下再发出来);以便明天能更好的学习PL/SQL的循环,今天太累了,所以早点睡觉,明天继续PL/SQL总有一天我会将你永远的记载在心里,,,
函数;
函数:PL/SQL中的函数相当于java中的方法;函数有返回值
定义函数的
--输入姓名找到该姓名的年薪
create or re
Mockito(二)--实例篇
bijian1013
持续集成 mockito 单元测试
学习了基本知识后,就可以实战了,Mockito的实际使用还是比较麻烦的。因为在实际使用中,最常遇到的就是需要模拟第三方类库的行为。
比如现在有一个类FTPFileTransfer,实现了向FTP传输文件的功能。这个类中使用了a
精通Oracle10编程SQL(7)编写控制结构
bijian1013
oracle 数据库 plsql
/*
*编写控制结构
*/
--条件分支语句
--简单条件判断
DECLARE
v_sal NUMBER(6,2);
BEGIN
select sal into v_sal from emp
where lower(ename)=lower('&name');
if v_sal<2000 then
update emp set
【Log4j二】Log4j属性文件配置详解
bit1129
log4j
如下是一个log4j.properties的配置
log4j.rootCategory=INFO, stdout , R
log4j.appender.stdout=org.apache.log4j.ConsoleAppender
log4j.appender.stdout.layout=org.apache.log4j.PatternLayout
log4j.appe
java集合排序笔记
白糖_
java
public class CollectionDemo implements Serializable,Comparable<CollectionDemo>{
private static final long serialVersionUID = -2958090810811192128L;
private int id;
private String nam
java导致linux负载过高的定位方法
ronin47
定位java进程ID
可以使用top或ps -ef |grep java
![图片描述][1]
根据进程ID找到最消耗资源的java pid
比如第一步找到的进程ID为5431
执行
top -p 5431 -H
![图片描述][2]
打印java栈信息
$ jstack -l 5431 > 5431.log
在栈信息中定位具体问题
将消耗资源的Java PID转
给定能随机生成整数1到5的函数,写出能随机生成整数1到7的函数
bylijinnan
函数
import java.util.ArrayList;
import java.util.List;
import java.util.Random;
public class RandNFromRand5 {
/**
题目:给定能随机生成整数1到5的函数,写出能随机生成整数1到7的函数。
解法1:
f(k) = (x0-1)*5^0+(x1-
PL/SQL Developer保存布局
Kai_Ge
近日由于项目需要,数据库从DB2迁移到ORCAL,因此数据库连接客户端选择了PL/SQL Developer。由于软件运用不熟悉,造成了很多麻烦,最主要的就是进入后,左边列表有很多选项,自己删除了一些选项卡,布局很满意了,下次进入后又恢复了以前的布局,很是苦恼。在众多PL/SQL Developer使用技巧中找到如下这段:
&n
[未来战士计划]超能查派[剧透,慎入]
comsci
计划
非常好看,超能查派,这部电影......为我们这些热爱人工智能的工程技术人员提供一些参考意见和思想........
虽然电影里面的人物形象不是非常的可爱....但是非常的贴近现实生活....
&nbs
Google Map API V2
dai_lm
google map
以后如果要开发包含google map的程序就更麻烦咯
http://www.cnblogs.com/mengdd/archive/2013/01/01/2841390.html
找到篇不错的文章,大家可以参考一下
http://blog.sina.com.cn/s/blog_c2839d410101jahv.html
1. 创建Android工程
由于v2的key需要G
java数据计算层的几种解决方法2
datamachine
java sql 集算器
2、SQL
SQL/SP/JDBC在这里属于一类,这是老牌的数据计算层,性能和灵活性是它的优势。但随着新情况的不断出现,单纯用SQL已经难以满足需求,比如: JAVA开发规模的扩大,数据量的剧增,复杂计算问题的涌现。虽然SQL得高分的指标不多,但都是权重最高的。
成熟度:5星。最成熟的。
Linux下Telnet的安装与运行
dcj3sjt126com
linux telnet
Linux下Telnet的安装与运行 linux默认是使用SSH服务的 而不安装telnet服务 如果要使用telnet 就必须先安装相应的软件包 即使安装了软件包 默认的设置telnet 服务也是不运行的 需要手工进行设置 如果是redhat9,则在第三张光盘中找到 telnet-server-0.17-25.i386.rpm
PHP中钩子函数的实现与认识
dcj3sjt126com
PHP
假如有这么一段程序:
function fun(){
fun1();
fun2();
}
首先程序执行完fun1()之后执行fun2()然后fun()结束。
但是,假如我们想对函数做一些变化。比如说,fun是一个解析函数,我们希望后期可以提供丰富的解析函数,而究竟用哪个函数解析,我们希望在配置文件中配置。这个时候就可以发挥钩子的力量了。
我们可以在fu
EOS中的WorkSpace密码修改
蕃薯耀
修改WorkSpace密码
EOS中BPS的WorkSpace密码修改
>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
蕃薯耀 201
SpringMVC4零配置--SpringSecurity相关配置【SpringSecurityConfig】
hanqunfeng
SpringSecurity
SpringSecurity的配置相对来说有些复杂,如果是完整的bean配置,则需要配置大量的bean,所以xml配置时使用了命名空间来简化配置,同样,spring为我们提供了一个抽象类WebSecurityConfigurerAdapter和一个注解@EnableWebMvcSecurity,达到同样减少bean配置的目的,如下:
applicationContex
ie 9 kendo ui中ajax跨域的问题
jackyrong
AJAX跨域
这两天遇到个问题,kendo ui的datagrid,根据json去读取数据,然后前端通过kendo ui的datagrid去渲染,但很奇怪的是,在ie 10,ie 11,chrome,firefox等浏览器中,同样的程序,
浏览起来是没问题的,但把应用放到公网上的一台服务器,
却发现如下情况:
1) ie 9下,不能出现任何数据,但用IE 9浏览器浏览本机的应用,却没任何问题
不要让别人笑你不能成为程序员
lampcy
编程 程序员
在经历六个月的编程集训之后,我刚刚完成了我的第一次一对一的编码评估。但是事情并没有如我所想的那般顺利。
说实话,我感觉我的脑细胞像被轰炸过一样。
手慢慢地离开键盘,心里很压抑。不禁默默祈祷:一切都会进展顺利的,对吧?至少有些地方我的回答应该是没有遗漏的,是不是?
难道我选择编程真的是一个巨大的错误吗——我真的永远也成不了程序员吗?
我需要一点点安慰。在自我怀疑,不安全感和脆弱等等像龙卷风一
马皇后的贤德
nannan408
马皇后不怕朱元璋的坏脾气,并敢理直气壮地吹耳边风。众所周知,朱元璋不喜欢女人干政,他认为“后妃虽母仪天下,然不可使干政事”,因为“宠之太过,则骄恣犯分,上下失序”,因此还特地命人纂述《女诫》,以示警诫。但马皇后是个例外。
有一次,马皇后问朱元璋道:“如今天下老百姓安居乐业了吗?”朱元璋不高兴地回答:“这不是你应该问的。”马皇后振振有词地回敬道:“陛下是天下之父,
选择某个属性值最大的那条记录(不仅仅包含指定属性,而是想要什么属性都可以)
Rainbow702
sql group by 最大值 max 最大的那条记录
好久好久不写SQL了,技能退化严重啊!!!
直入主题:
比如我有一张表,file_info,
它有两个属性(但实际不只,我这里只是作说明用):
file_code, file_version
同一个code可能对应多个version
现在,我想针对每一个code,取得它相关的记录中,version 值 最大的那条记录,
SQL如下:
select
*
VBScript脚本语言
tntxia
VBScript
VBScript 是基于VB的脚本语言。主要用于Asp和Excel的编程。
VB家族语言简介
Visual Basic 6.0
源于BASIC语言。
由微软公司开发的包含协助开发环境的事
java中枚举类型的使用
xiao1zhao2
java enum 枚举 1.5新特性
枚举类型是j2se在1.5引入的新的类型,通过关键字enum来定义,常用来存储一些常量.
1.定义一个简单的枚举类型
public enum Sex {
MAN,
WOMAN
}
枚举类型本质是类,编译此段代码会生成.class文件.通过Sex.MAN来访问Sex中的成员,其返回值是Sex类型.
2.常用方法
静态的values()方