常用Iview组件集合以及常用特性
Button
可以选择不同类型代表会以不同颜色呈现
可以选择边框是否为虚线或者为文本模式的按钮
可设置为幽灵按钮
可设置loading状态
可禁用
size只可选small、default、large三种
Icon
可根据type来选择不同的图标样子
size可设置大小，单位px
color可设置颜色
Typography文字排版
分别有
<Txt> <Pragraph>三种组件，分别适用于标题、不同样式的文本、段落，这三个组件都可设置是否可复制、添加删除线样式、是否可编辑、文本类型，其中Pragraph可以设置超过多少行显示省略号并且是否可展开</p>
<h3>Divider</h3>
<p>方向可选vertical、horizental<br> 是否为虚线<br> 若有文本，文本的位置左、中、右</p>
<h3>Grid栅格</h3>
<p>栅格其实可以做水平布局<br> Row中放置Col，col的总数小于24<br> 可以给Row中的Col设置间隔，可设置改变栅格顺序<br> 可设置左右偏移量<br> flex布局的justify、align属性可以使用<br> 可响应式布局</p>
<h3>Layout</h3>
<p>布局的组件<br> 里面可放置Header、Content、Sider、Footer<br> 可设置折叠属性</p>
<h3>Space间隔</h3>
<p>设置间隔<br> 可以设置水平间隔和垂直间隔<br> 可用v-model双向绑定自定义间隔</p>
<h3>Split面板分隔</h3>
<p>可以将一片区域分割为可以拖拽调整宽度或高度的两部分区域<br> 可嵌套使用</p>
<h3>Cell单元格</h3>
<p>用于固定的菜单列表<br> 每一项单元格可设置禁用以及选中</p>
<h3>Affix图钉</h3>
<p>可以将内容固定在屏幕上，位置是相对于浏览器的位置而定的</p>
<h3>Breadcrumb面包屑</h3>
<p>显示网站的层级结构并标识当前所在位置，并可添加导航和vue-router结合使用</p>
<h3>Dropdown下拉菜单</h3>
<p>可以设置如何触发，hover、click、右键、custom自定义<br> 可嵌套</p>
<h3>Menu导航菜单</h3>
<p>可选择主题风格<br> 可选vertical、horizontal</p>
<h3>Page分页</h3>
<p>用于分页快速切换<br> 可以设置快速跳转<br> 可以设置每页数量</p>
<h3>PageHeader页头</h3>
<p>用于做页头<br> 可带面包屑、可带内容<br> 可用slot嵌套一些内容</p>
<h3>Steps步骤条</h3>
<p>用于显示某项流程的步骤</p>
<h3>AutoComplete自动完成</h3>
<p>输入框自动完成<br> 可通过data属性自定义自动完成数据源<br> 也可通过传入Option组件作为选项<br> 可不区分大小写<br> 自定义Option显示复杂的布局</p>
<h3>Checkbox多选框</h3>
<p>用于多项选择，用v-model双向绑定选中数据<br> 可设置全选</p>
<h3>Cascader级联选择</h3>
<p>通常用语一组相关联并且递进的数据集合<br> 可与搜索合并，搜索并选择</p>
<h3>DatePicker日期选择器</h3>
<p>年月日 选择时间点或者时间段<br> 可添加具体日子的快捷方式<br> 可多选<br> 可选择时间</p>
<h3>Form表单</h3>
<p>具有数据收集、校验和提交功能的表单<br> 此组件非常重要，特别是校验功能</p>
<h3>InputNumber数字输入框</h3>
<p>只允许输入数字的输入框，并且可以设置一定的范围<br> 可设置禁用、可编辑、小数等功能</p>
<h3>Input输入框</h3>
<p>输入框，可设置三种尺寸，可设置是否可清空<br> 可设置Icon，可设置slot前缀后缀<br> 可设置文本域输入，输入段落</p>
<h3>Mentions提及</h3>
<p>用于在输入中提及某人或某事，等同于@功能<br> 可与Form配合使用<br> 可自定义匹配字符</p>
<h3>Rate评分</h3>
<p>评分组件<br> 可半星、可显示提示<br> 只读<br> 可自定义字符</p>
<h3>Radio单选框</h3>
<p>可用v-model双向绑定，可选择button样式单选框</p>
<h3>Switch开关</h3>
<p>进行两种状态切换<br> 可禁用、可加载</p>
<h3>Slider滑块</h3>
<p>可单方向滑<br> 可设置range，双方向滑<br> 可用离散值，离散值时可显示间断点<br> 可用输入框输入值</p>
<h3>Select选择器</h3>
<p>支持单选、多选、搜索以及键盘快捷操作<br> transfer属性很重要，可以避免在position：fixed的定位中被覆盖</p>
<h3>Transfer穿梭框</h3>
<p>双栏穿梭选择框，常用于将多个项目从一边移到另一边<br> 详情例子请官网</p>
<h3>TimerPicker时间选择器</h3>
<p>选择或输入标准时间，支持选择范围</p>
<h3>Upload上传</h3>
<p>可支持上传单个文件、多个文件<br> 支持拖拽上传<br> 还可以自定义上传列表，如上传照片并展示</p>
<h3>ColorPicker颜色选择器</h3>
<p>v-model双向绑定颜色数据<br> 可默认选择<br> 可预设选择</p>
<h3>Avatar头像</h3>
<p>设置src获取头像<br> 可设置徽标</p>
<h3>Badge徽标</h3>
<p>可设置为右上角或者dot型<br> 颜色可选</p>
<h3>Comment评论</h3>
<p>基本用法带有作者名、头像、时间和操作（点赞、评论、转发）<br> 可配合List组件<br> 可嵌套评论<br> 提供评论框</p>
<h3>Collapse折叠面板</h3>
<p>可绑定默认打开、可手风琴模式<br> 可嵌套</p>
<h3>Carousel走马灯</h3>
<p>通常用于轮播一组图片或卡片轮播<br> 可自动切换<br> 包括切换速度、指示器样式、指示器位置、切换箭头显示、指示器触发都可调整</p>
<h3>Card卡片</h3>
<p>基础容器，用来显示文字、列表、图文等内容，也可以配合其他组件一起使用，基本上用于数据展示或者名片展示，也可以用于布局，基本上相当于div，可嵌套</p>
<h3>Calendar日历</h3>
<p>按照日历形式展示数据的容器<br> 可显示通知事项<br> 可用卡片模式<br> 可选择</p>
<h3>Description描述列表</h3>
<p><em>用于显示多个只读字段<br> 很类似于只读的Table，可设置边框和背景颜色</em><br> 其实不对，这几天自己用了一下， 原来它并不是放只读字段的，也可以嵌套组件，感觉他的真实用途应该是以一种表格的方式但又没有Table那么强大，当然也没有Table使用起来那么复杂</p>
<h3>Empty空状态</h3>
<p>展示空数据时的页面</p>
<h3>List列表</h3>
<p>列表展示，最基础的用法<br> Loading和栅格布局也都有</p>
<h3>Poptip气泡提示</h3>
<p>可hover，click，focus触发<br> 位置可调<br> mask可关<br> 可嵌套复杂内容</p>
<h3>Statistic统计数值</h3>
<p>可展示一些需要突出的数值<br> 可prefix或者suffix内容，加单位、icon或者百分比都可以<br> 可以做倒计时组件Countdown</p>
<h3>Tree树形控件</h3>
<p>可以做级联展示<br> 可用show-checkbox多选<br> 也可以自定义结点</p>
<h3>Tooltip文字提示</h3>
<p>hover时会显示<br> 可调位置<br> 可禁用<br> transfer属性很重要，可以避免在position：fixed的定位中被覆盖</p>
<h3>TimeLine时间轴</h3>
<p>对一系列信息进行时间排序，用法很基础</p>
<h3>Tag标签</h3>
<p>可删除<br> 颜色可选</p>
<h3>Tabs标签页</h3>
<p>通常用于切换一些比较简单的页面，如果切换较复杂页面，建议Menu</p>
<h3>Table表格</h3>
<p>这个组件可就复杂了<br> 可单独设计每列的render<br> 可多选<br> 可筛选</p>
<h3>Time相对时间</h3>
<p>常用于表示几秒钟前，几分钟前，几天前</p>
<h3>Alert警告提示</h3>
<h3>Circle进度环</h3>
<p>用于显示百分比进度，可配合外部组件使用<br> 可设置成仪表盘样式</p>
<h3>Drawer抽屉</h3>
<p>用于侧边栏的显示<br> 可嵌套多层抽屉<br> 可自定义内容</p>
<h3>Modal对话框</h3>
<h3>Message全局提示</h3>
<h3>Notice通知提醒</h3>
<h3>Progress进度条</h3>
<p>。。。未完待续</p>
</div>
</div>
</div>
</div>
</div>
<!--PC和WAP自适应版-->
<div id="SOHUCS" sid="1682027717442220032"></div>
<script type="text/javascript" src="/views/front/js/chanyan.js"></script>
<!-- 文章页-底部 动态广告位 -->
<div class="youdao-fixed-ad" id="detail_ad_bottom"></div>
</div>
<div class="col-md-3">
<div class="row" id="ad">
<!-- 文章页-右侧1 动态广告位 -->
<div id="right-1" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad">
<div class="youdao-fixed-ad" id="detail_ad_1"> </div>
</div>
<!-- 文章页-右侧2 动态广告位 -->
<div id="right-2" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad">
<div class="youdao-fixed-ad" id="detail_ad_2"></div>
</div>
<!-- 文章页-右侧3 动态广告位 -->
<div id="right-3" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad">
<div class="youdao-fixed-ad" id="detail_ad_3"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="container">
<h4 class="pt20 mb15 mt0 border-top">你可能感兴趣的:(Vue,前端,vue.js)</h4>
<div id="paradigm-article-related">
<div class="recommend-post mb30">
<ul class="widget-links">
<li><a href="/article/1902104990672023552.htm"
title="Vue 3 事件总线详解：构建组件间高效通信的桥梁" target="_blank">Vue 3 事件总线详解：构建组件间高效通信的桥梁</a>
<span class="text-muted">love729234ming</span>
<a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a>
<div>Vue3事件总线详解：构建组件间高效通信的桥梁为什么需要事件总线？使用mitt实现事件总线1.安装mitt2.创建事件总线3.在组件中使用事件总线发送端组件（例如ComponentA.vue）接收端组件（例如ComponentB.vue）自定义实现事件总线总结在复杂的前端应用中，组件之间的通信往往需要一种灵活且解耦的方式。传统的Vue2中，我们常使用全局事件总线来实现这种通信，但在Vue3中，由于</div>
</li>
<li><a href="/article/1902103476058517504.htm"
title="手机租赁系统开发全面解析与实现指南" target="_blank">手机租赁系统开发全面解析与实现指南</a>
<span class="text-muted">红点租赁系统开发</span>
<a class="tag" taget="_blank" href="/search/%E5%85%B6%E4%BB%96/1.htm">其他</a>
<div>内容概要手机租赁系统的设计理念是为了满足用户对便捷、灵活的手机使用需求。想象一下，谁还愿意花大价钱买一部手机呢？尤其是当新款手机频繁推出时，租赁似乎成了更受欢迎的选择。这个系统旨在让用户可以随时随地选择租用不同型号的手机，极大提升了用户体验。接下来，我们将深入探讨这个系统的技术架构。它通常包含前端界面、后端处理和数据库管理三个核心部分。前端负责与用户交互，后端则处理数据逻辑，而数据库则是存储所有租</div>
</li>
<li><a href="/article/1902103221925638144.htm"
title="Vue 3 事件总线详解：构建组件间高效通信的桥梁" target="_blank">Vue 3 事件总线详解：构建组件间高效通信的桥梁</a>
<span class="text-muted">QQ828929QQ</span>
<a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a>
<div>Vue3事件总线详解：构建组件间高效通信的桥梁为什么需要事件总线？使用mitt实现事件总线1.安装mitt2.创建事件总线3.在组件中使用事件总线发送端组件（例如ComponentA.vue）接收端组件（例如ComponentB.vue）自定义实现事件总线总结在复杂的前端应用中，组件之间的通信往往需要一种灵活且解耦的方式。传统的Vue2中，我们常使用全局事件总线来实现这种通信，但在Vue3中，由于</div>
</li>
<li><a href="/article/1902103220042395648.htm"
title="Vue Markdown 编辑器全攻略：轻松集成 MD 编辑器到前端项目" target="_blank">Vue Markdown 编辑器全攻略：轻松集成 MD 编辑器到前端项目</a>
<span class="text-muted">软件工匠师</span>
<a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/%E7%BC%96%E8%BE%91%E5%99%A8/1.htm">编辑器</a>
<div>VueMarkdown编辑器全攻略：轻松集成MD编辑器到前端项目1.为什么选择Markdown编辑器？2.安装v-md-editor3.全局配置与集成4.在组件中使用Markdown编辑器5.高级配置与自定义功能6.总结在现代前端开发中，Markdown编辑器被广泛应用于博客、内容管理系统、在线文档等场景。本文将以Vue3为例，详细介绍如何使用v-md-editor库在项目中集成Markdown编</div>
</li>
<li><a href="/article/1902096020553134080.htm"
title="工程化与框架系列（9）--前端监控体系" target="_blank">工程化与框架系列（9）--前端监控体系</a>
<span class="text-muted">一进制ᅟᅠ </span>
<a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E5%B7%A5%E7%A8%8B%E5%8C%96%E4%B8%8E%E6%A1%86%E6%9E%B6/1.htm">前端工程化与框架</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a>
<div>前端监控体系前端监控是现代Web应用不可或缺的组成部分，它帮助我们了解应用的运行状况、用户行为和潜在问题。本文将详细介绍如何构建一个完整的前端监控体系。监控体系概述小知识：前端监控体系通常包括性能监控、错误监控、用户行为分析和业务监控四大模块，通过这些数据可以全面了解应用的健康状况和用户体验。为什么需要前端监控在复杂的前端应用中，监控系统能够帮助我们：及时发现问题捕获JS运行时错误监控API请求异</div>
</li>
<li><a href="/article/1902095136700035072.htm"
title="工程化与框架系列（36）--前端监控告警实践" target="_blank">工程化与框架系列（36）--前端监控告警实践</a>
<span class="text-muted">一进制ᅟᅠ </span>
<a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E5%B7%A5%E7%A8%8B%E5%8C%96%E4%B8%8E%E6%A1%86%E6%9E%B6/1.htm">前端工程化与框架</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a>
<div>前端监控告警实践引言前端监控是保障应用质量和用户体验的重要手段。本文将深入探讨前端监控的实现方案，包括性能监控、错误监控、用户行为监控等方面，以及相应的告警机制。监控系统概述前端监控系统主要包括以下方面：性能监控：页面加载、资源加载、接口性能等错误监控：JS错误、接口错误、资源加载错误等用户行为：PV/UV、点击行为、路由变化等业务监控：转化率、留存率、业务指标等告警系统：规则配置、通知分发、告警</div>
</li>
<li><a href="/article/1902080251165470720.htm"
title="Python与C ++开发匿名捐赠1对1管理APP" target="_blank">Python与C ++开发匿名捐赠1对1管理APP</a>
<span class="text-muted">Geeker-2025</span>
<a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/c%2B%2B/1.htm">c++</a>
<div>开发一款用于**匿名捐赠1对1管理**的App，结合Python和C++的优势，可以实现高效的后端数据处理、实时的捐赠监控以及用户友好的前端界面。以下是一个详细的开发方案，涵盖技术选型、功能模块、开发步骤等内容。##技术选型###后端（Python）-**编程语言**：Python-**Web框架**：Django或Flask-**数据库**：PostgreSQL或MySQL-**实时通信**：W</div>
</li>
<li><a href="/article/1902072707894276096.htm"
title="SvelteKit 最新中文文档教程（5）—— 页面选项" target="_blank">SvelteKit 最新中文文档教程（5）—— 页面选项</a>
<span class="text-muted"></span>
<div>前言Svelte，一个语法简洁、入门容易，面向未来的前端框架。从Svelte诞生之初，就备受开发者的喜爱，根据统计，从2019年到2024年，连续6年一直是开发者最感兴趣的前端框架No.1：Svelte以其独特的编译时优化机制著称，具有轻量级、高性能、易上手等特性，非常适合构建轻量级Web项目。为了帮助大家学习Svelte，我同时搭建了Svelte最新的中文文档站点。如果需要进阶学习，也可以入手我</div>
</li>
<li><a href="/article/1902070545550209024.htm"
title="【Vuex：在带命名空间的模块内访问全局内容】" target="_blank">【Vuex：在带命名空间的模块内访问全局内容】</a>
<span class="text-muted">武帝为此</span>
<a class="tag" taget="_blank" href="/search/%E5%89%8D%E5%90%8E%E7%AB%AF/1.htm">前后端</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a>
<div>文章目录一、命名空间与全局内容的关系1.什么是命名空间？✅开启命名空间二、在命名空间模块内访问全局内容1.访问全局state2.访问全局getters3.调用全局mutations4.调用全局actions三、示例：模块间访问与全局状态共享1.定义模块2.注册模块3.测试调用四、常见问题与注意事项1.如何在组件中访问其他模块的state？2.模块命名冲突问题五、总结一、命名空间与全局内容的关系1.</div>
</li>
<li><a href="/article/1902060585990811648.htm"
title="react实现虚拟列表" target="_blank">react实现虚拟列表</a>
<span class="text-muted">束尘</span>
<a class="tag" taget="_blank" href="/search/react.js/1.htm">react.js</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a>
<div>在前端开发中，当一次性渲染大量数据时，直接渲染所有DOM节点，会造成渲染过慢，浏览器卡顿的现象，导致用户体验不佳，为了改善这种情况，提出使用虚拟列表的方式进行渲染。虚拟列表的实现思路1.只渲染可见区域：计算当前可见区域的起始索引和结束索引。只渲染可见区域内的列表项，其他区域用空白占位。2.动态计算高度：如果列表项高度固定，可以直接计算。如果列表项高度不固定，需要动态计算每个列表项的高度。3.滚动时</div>
</li>
<li><a href="/article/1902059704494911488.htm"
title="前端大文件上传,分片方式上传" target="_blank">前端大文件上传,分片方式上传</a>
<span class="text-muted">Sunsit</span>
<a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91/1.htm">前端开发</a><a class="tag" taget="_blank" href="/search/vue/1.htm">vue</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a>
<div>前端大文件分片上传文件上传超时：原因是前端请求框架限制最大请求时长，后端设置了接口访问的超时时间，或者是nginx（或其它代理/网关）限制了最大请求时长。文件大小超限：原因在于后端对单个请求大小做了限制，一般nginx和server都会做这个限制。上传时间过久（想想10个g的文件上传，这不得花个几个小时的时间）由于各种网络原因上传失败，且失败之后需要从头开始整体思路前端根据代码中设置好的分片大小将</div>
</li>
<li><a href="/article/1902057560559644672.htm"
title="前端大文件分片上传" target="_blank">前端大文件分片上传</a>
<span class="text-muted">北凉柿子i</span>
<a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a>
<div>1.分片上传整体流程开始上传：前端启动文件分片上传。后端返回唯一标识。分片上传：获取到上传的文件，然后设置一个固定的分片大小，将文件切成多个小片，计算出每一个分片的MD5值（32位）。将每个分片的内容和MD5标识符一同上传至服务器。服务端接收每个分片及相关信息后，通过对每个分片进行校验，来确保分片的完整性。结束上传：当分片上传完毕或者前端取消上传时，调用结束上传接口结束此次文件上传操作。结束上传时</div>
</li>
<li><a href="/article/1902055416611794944.htm"
title="【脑洞小剧场】零帧起手创业小公司之 新人入职的一天" target="_blank">【脑洞小剧场】零帧起手创业小公司之 新人入职的一天</a>
<span class="text-muted">Foyo Designer</span>
<a class="tag" taget="_blank" href="/search/%E6%8A%80%E6%9C%AF%E8%81%8C%E5%9C%BA%E5%B0%8F%E5%89%A7/1.htm">技术职场小剧</a><a class="tag" taget="_blank" href="/search/%E8%81%8C%E5%9C%BA%E5%92%8C%E5%8F%91%E5%B1%95/1.htm">职场和发展</a><a class="tag" taget="_blank" href="/search/%E7%A8%8B%E5%BA%8F%E4%BA%BA%E7%94%9F/1.htm">程序人生</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0%E6%96%B9%E6%B3%95/1.htm">学习方法</a><a class="tag" taget="_blank" href="/search/%E6%94%B9%E8%A1%8C%E5%AD%A6it/1.htm">改行学it</a><a class="tag" taget="_blank" href="/search/%E5%88%9B%E4%B8%9A%E5%88%9B%E6%96%B0/1.htm">创业创新</a><a class="tag" taget="_blank" href="/search/%E8%BF%9C%E7%A8%8B%E5%B7%A5%E4%BD%9C/1.htm">远程工作</a><a class="tag" taget="_blank" href="/search/%E7%A8%8B%E5%BA%8F%E5%91%98%E5%88%9B%E5%AF%8C/1.htm">程序员创富</a>
<div>点击查看小剧场合集https://blog.csdn.net/foyodesigner/category_12896948.html阳光明媚的早晨，段萌儿怀揣着对新工作的无限憧憬，踏入了这家充满未知的小公司。然而，她万万没想到，第一天上班就迎来了一场“惊悚”之旅。场景一：段萌儿的“惊悚”发现段萌儿，新入职的前端工程师，一早便迫不及待地打开了公司的代码库，想要一窥项目的“真容”。然而，当她看到代码库</div>
</li>
<li><a href="/article/1902053525916020736.htm"
title="前端大文件上传（分片上传）与下载" target="_blank">前端大文件上传（分片上传）与下载</a>
<span class="text-muted">束尘</span>
<a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a>
<div>文章目录一、问题二、思路1、选择文件2、校验文件是否符合规范3、文件切片上传4、分片上传注意点5、大文件下载一、问题日常业务中难免出现前端需要向后端传输大型文件的情况，这时单次的请求不能满足传输大文件的需求，就需要用到分片上传业务需求为：用户可以上传小于20G的镜像文件，并进显示当前上传进度前端：vue3.x+ElementPlus组件+axios二、思路解决思路简单为前端选择文件后读取到文件的基</div>
</li>
<li><a href="/article/1902053147740794880.htm"
title="html重点知识总结" target="_blank">html重点知识总结</a>
<span class="text-muted">*goliter *</span>
<a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a>
<div>html重点知识一直在网上看过许多不同的前端资料，但是总觉的只是单单的阅读和记忆不能够真正的加深自己的知识理解，所以开始尝试自己在不查看其他一切资料的情况下对自己了解的知识做一个总结（顺序或许有点乱），如果之后发现有不足再来补充，我相信输出才是最好的输入！！！H5新增内容语义化标签：h5新增了一系列语义化标签，他们本质上和一般的div标签没有区别，但是在语义上有不同。header：专门指页面的顶部</div>
</li>
<li><a href="/article/1902050625806462976.htm"
title="使用axios实现实时获取文件上传/下载进度。实现文件上传，下载进度条显示" target="_blank">使用axios实现实时获取文件上传/下载进度。实现文件上传，下载进度条显示</a>
<span class="text-muted">三年模拟五年烧烤</span>
<a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a>
<div>下载文件实现进度条显示利用axios封装的原生onDownloadProgress属性，该属性为一个回调方法，当axios请求将文件从服务器下载时会进行回调。接收一个回调参数，该回调参数中包含总下载进度，当前下载进度。不多比比直接上代码下载下载进度:{{downLoadProgress}}import{ref}from'@vue/reactivity';importaxiosfrom'axios'</div>
</li>
<li><a href="/article/1902036120892403712.htm"
title="VUE动态路由" target="_blank">VUE动态路由</a>
<span class="text-muted">qq_41164527</span>
<a class="tag" taget="_blank" href="/search/vue/1.htm">vue</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a>
<div>在Vue.js中，路由是实现单页应用（SPA）的核心功能之一。Vue提供了vue-router库来管理路由。以下是Vue路由的几种常见方式：1.声明式路由导航（使用）是VueRouter提供的组件，用于声明式导航。它会被渲染成一个标签，点击后会跳转到指定的路由。HomeAboutto属性指定目标路由的路径。默认会渲染为标签，点击后不会刷新页面，而是通过VueRouter进行路由切换。2.编程式路由</div>
</li>
<li><a href="/article/1902035993901461504.htm"
title="Vue 过滤器深度解析与应用实践" target="_blank">Vue 过滤器深度解析与应用实践</a>
<span class="text-muted">二川bro</span>
<a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a>
<div>文章目录1.过滤器概述1.1核心概念1.2过滤器生命周期2.过滤器基础2.1过滤器定义2.2过滤器使用3.过滤器高级用法3.1链式调用3.2参数传递3.3动态过滤器4.过滤器应用场景4.1文本格式化4.2数字处理4.3数据过滤5.性能优化与调试5.1性能优化策略5.2调试技巧6.最佳实践建议6.1命名规范6.2代码组织7.常见问题与解决方案7.1问题列表7.2调试技巧8.扩展阅读1.过滤器概述1.</div>
</li>
<li><a href="/article/1902035237249019904.htm"
title="JS逆向案例-致远OA的前端密码加密逆向分析" target="_blank">JS逆向案例-致远OA的前端密码加密逆向分析</a>
<span class="text-muted">布啦啦李</span>
<a class="tag" taget="_blank" href="/search/%E6%88%91%E7%9A%84%E6%B8%97%E9%80%8F%E7%AC%94%E8%AE%B0/1.htm">我的渗透笔记</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/JS%E9%80%86%E5%90%91/1.htm">JS逆向</a><a class="tag" taget="_blank" href="/search/javascript%E9%80%86%E5%90%91/1.htm">javascript逆向</a><a class="tag" taget="_blank" href="/search/%E8%87%B4%E8%BF%9COA/1.htm">致远OA</a><a class="tag" taget="_blank" href="/search/%E5%AF%86%E7%A0%81%E7%88%86%E7%A0%B4/1.htm">密码爆破</a><a class="tag" taget="_blank" href="/search/%E9%98%B2%E8%8C%83%E6%8E%AA%E6%96%BD/1.htm">防范措施</a><a class="tag" taget="_blank" href="/search/js%E9%80%86%E5%90%91/1.htm">js逆向</a>
<div>免责声明本文仅为技术研究与渗透测试思路分享，旨在帮助安全从业人员更好地理解相关技术原理和防御措施。任何个人或组织不得利用本文内容从事非法活动或攻击他人系统。如果任何人因违反法律法规或不当使用本文内容而导致任何法律后果，本文作者概不负责。请务必遵守法律法规，合理使用技术知识。一、致远OA的登录过程1.1实验版本致远A6+协同管理软件V8.0SP2用户名不变，密码加密，无验证码。1.2登录过程步骤操作</div>
</li>
<li><a href="/article/1902033347937366016.htm"
title="【H2O2 | 软件开发】什么是Promise？" target="_blank">【H2O2 | 软件开发】什么是Promise？</a>
<span class="text-muted">过期的H2O2</span>
<a class="tag" taget="_blank" href="/search/%E3%80%90H2O2%E3%80%91%E5%85%A8%E6%A0%88%E9%9D%A2%E8%AF%95%E9%A2%98/1.htm">【H2O2】全栈面试题</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/ecmascript6/1.htm">ecmascript6</a>
<div>目录前言开篇语准备工作正文概述三种状态创建和使用链式操作多对象处理语法糖回调地狱和优化结束语前言开篇语本系列为短篇，每次讲述少量知识点，无需一次性灌输太多的新知识点。该主题文章主要是围绕前端、全栈开发相关面试常见问题撰写的，希望对诸位有所帮助。如果您需要为面试八股文做准备，笔者建议重点关注加粗强调部分，它们是概念中的关键词。准备工作软件：【参考版本】VisualStudioCode系统版本：Win</div>
</li>
<li><a href="/article/1902015701581885440.htm"
title="谈谈 TypeScript 中的模块系统，如何使用 ES Modules 和 CommonJS 模块？" target="_blank">谈谈 TypeScript 中的模块系统，如何使用 ES Modules 和 CommonJS 模块？</a>
<span class="text-muted">程序员黄同学</span>
<a class="tag" taget="_blank" href="/search/TypeScript/1.htm">TypeScript</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91/1.htm">前端开发</a><a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/typescript/1.htm">typescript</a><a class="tag" taget="_blank" href="/search/ubuntu/1.htm">ubuntu</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a>
<div>模块系统是TypeScript项目组织代码的核心机制，主要用于代码拆分、复用和依赖管理。TypeScript支持ESModules（ESM）和CommonJS两种主流模块系统，理解它们的差异和使用场景是前端开发中的必备技能。以下从基础语法、配置、互操作性到实战建议展开说明。一、ESModules（ESM）：标准化的模块系统1.基础语法ESM使用import/export语法，是ECMAScript</div>
</li>
<li><a href="/article/1902002343403122688.htm"
title="ChatGPT + Vue3：如何打造 AI 智能助手？" target="_blank">ChatGPT + Vue3：如何打造 AI 智能助手？</a>
<span class="text-muted">Js_x</span>
<a class="tag" taget="_blank" href="/search/chatgpt/1.htm">chatgpt</a><a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a>
<div>引言人工智能（AI）正快速渗透到前端开发领域，越来越多的开发者希望将ChatGPT集成到自己的应用中，为用户提供智能对话、自动回复、辅助决策等功能。本文将介绍如何使用Vue3+OpenAIAPI搭建一个AI智能助手，让你的应用拥有强大的AI交互能力。1.项目准备1.1技术栈选择本项目将使用以下技术：Vue3-现代化的前端框架，响应式强，适合构建交互式应用。Vite-高效的Vue3项目构建工具，提升</div>
</li>
<li><a href="/article/1901994148504858624.htm"
title="vue对接openai_实现ChatGPT" target="_blank">vue对接openai_实现ChatGPT</a>
<span class="text-muted">开心小老虎</span>
<a class="tag" taget="_blank" href="/search/vue3%E7%9F%A5%E8%AF%86%E7%82%B9%2B%E7%BB%84%E4%BB%B6/1.htm">vue3知识点+组件</a><a class="tag" taget="_blank" href="/search/chatgpt/1.htm">chatgpt</a>
<div>一、openai密钥使用API密钥才能连接到OpenAIAPI，去OpenAI网站注册一个账户（目前国内访问openai受限制，需要其他方式进行访问），单击个人资料图片和“查看API密钥”，创建一个新的密钥。openai官网https://openai.com/二、使用openai包发送请求获得数据1.下载openai包npmiopenai--save2.使用openai包发送请求importOp</div>
</li>
<li><a href="/article/1901989738571689984.htm"
title="python后端常见架构_常见的后端框架" target="_blank">python后端常见架构_常见的后端框架</a>
<span class="text-muted">weixin_39622178</span>
<a class="tag" taget="_blank" href="/search/python%E5%90%8E%E7%AB%AF%E5%B8%B8%E8%A7%81%E6%9E%B6%E6%9E%84/1.htm">python后端常见架构</a>
<div>后端vs前端如果您是Web开发世界的新手，后端和前端开发之间的区别可能不那么明显，但是，了解两者之间的区别很重要。以下是前端开发人员与后端开发人员的一些区别。前端开发：前端开发人员在很大程度上负责用户所看到的内容(即网站页面)，前端开发人员主要使用HTML，CSS和JavaScript。他们的主要关注点是创建出色的用户体验，并确保网站设计和布局或Web应用程序始终具有凝聚力。后端开发：另一方面，后</div>
</li>
<li><a href="/article/1901986206401490944.htm"
title="【实习经历Two:参与开源项目，学习并应用Git】" target="_blank">【实习经历Two:参与开源项目，学习并应用Git】</a>
<span class="text-muted">学前端的小乐子</span>
<a class="tag" taget="_blank" href="/search/%E5%BC%80%E6%BA%90%E7%A4%BE%E5%8C%BA%E5%AE%9E%E4%B9%A0%E8%AE%B0%E5%BD%95/1.htm">开源社区实习记录</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a><a class="tag" taget="_blank" href="/search/git/1.htm">git</a>
<div>前端参与开源项目中使用过的git1.参与开源项目（必备技能——git)参与开源项目首先需要进入自己想参加的项目页面点击右边的Fork即可复制到自己的仓库像个人开发时常用的add、commit和push等命令就不过多介绍了，在这里主要是想记录一下自己作为从未参与过开源项目的初学者遇到的一些常用知识点，很感谢本人这次实习的mt老师很有耐心地帮助我解决使用Git过程中遇到的一些问题。a.如何在commi</div>
</li>
<li><a href="/article/1901983305918640128.htm"
title="Axios和ajax的异同点详解以及在express后端使用redirect重定向对ajax无效的原因！" target="_blank">Axios和ajax的异同点详解以及在express后端使用redirect重定向对ajax无效的原因！</a>
<span class="text-muted">char56789</span>
<a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/node.js/1.htm">node.js</a><a class="tag" taget="_blank" href="/search/reactjs/1.htm">reactjs</a>
<div>问题描述：在express中使用redirect进行重定向时，页面显示是301状态码，页面不跳转！（说明在express中不能使用redirect进行重定向）究其原因：使用ajax后，后端无法直接让前端进行页面跳转。需要前端进行状态码和后端返回的数据的判断，然后前端自己进行跳转页面。因为ajax（axios只是对ajax进行了封装，ajax在此处的特性对axios也适用）是一个完整的请求和回掉的过</div>
</li>
<li><a href="/article/1901974224818466816.htm"
title="【Django】【vue】设计一个评论模块" target="_blank">【Django】【vue】设计一个评论模块</a>
<span class="text-muted">患得患失949</span>
<a class="tag" taget="_blank" href="/search/%E5%90%8E%E7%AB%AF%E7%B3%BB%E7%BB%9F%E5%8A%9F%E8%83%BD/1.htm">后端系统功能</a><a class="tag" taget="_blank" href="/search/%E9%9D%A2%E8%AF%95%E8%80%83%E9%A2%98%E4%B8%93%E6%A0%8F%EF%BC%88%E5%89%8D%E5%90%8E%E7%AB%AF%EF%BC%89/1.htm">面试考题专栏（前后端）</a><a class="tag" taget="_blank" href="/search/django%E7%9F%A5%E8%AF%86/1.htm">django知识</a><a class="tag" taget="_blank" href="/search/django/1.htm">django</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E5%BA%93/1.htm">数据库</a>
<div>Django评论模块（前后端分离+点赞+收藏+评论计数）一、功能概述基于Django+DRF设计的评论模块，包含以下功能：基本评论功能（用户可以对文章进行评论，并支持多级回复）评论点赞（支持点赞/取消点赞）评论收藏（支持收藏/取消收藏）评论计数（统计文章的评论数量）嵌套评论（支持多级评论显示）二、后端设计（一）数据库模型（Models）fromdjango.dbimportmodelsfromdj</div>
</li>
<li><a href="/article/1901971956224290816.htm"
title="详细的讲一下Vite 在 Vue3 项目中最常用和最重要的配置项" target="_blank">详细的讲一下Vite 在 Vue3 项目中最常用和最重要的配置项</a>
<span class="text-muted">asecretman!</span>
<a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a>
<div>Vite在Vue3中的配置详解基础配置结构首先让我们看一个基础的Vite配置文件结构：import{defineConfig}from'vite'importvuefrom'@vitejs/plugin-vue'importpathfrom'path'exportdefaultdefineConfig({//配置项})详细配置项解析1.基础路径配置(base)exportdefaultdefine</div>
</li>
<li><a href="/article/1901970945363472384.htm"
title="前端架构师具备什么能力？前端性能优化全链路指南" target="_blank">前端架构师具备什么能力？前端性能优化全链路指南</a>
<span class="text-muted">kerwin_1727</span>
<a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E6%9E%B6%E6%9E%84%E5%B8%88%E5%85%B7%E5%A4%87%E4%BB%80%E4%B9%88%E8%83%BD%E5%8A%9B/1.htm">前端架构师具备什么能力</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96/1.htm">性能优化</a>
<div>前端性能优化全链路指南——从构建到运行，让你的页面飞起来！一、性能优化全链路概览性能优化不是“一招鲜”，而是从构建时到运行时的全流程优化。以下是核心链路：构建时：减少打包体积（TreeShaking、CodeSplitting）。加载时：加速资源加载（懒加载、预加载）。运行时：提升渲染效率（虚拟列表、WebWorker）。监控与诊断：用工具定位问题（ChromePerformance、Lighth</div>
</li>
<li><a href="/article/1901959215161864192.htm"
title="前端怎么处理请求失败会弹出一个 toast,如何保证批量请求失败，只弹出一个" target="_blank">前端怎么处理请求失败会弹出一个 toast,如何保证批量请求失败，只弹出一个</a>
<span class="text-muted">大莲芒</span>
<a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a>
<div>在前端处理批量请求时，确保只弹出一个toast通知，可以通过以下步骤实现：使用状态管理首先，您可以使用状态管理工具（例如React的useState或Redux）来跟踪请求的状态。创建一个Toast组件如果还没有创建toast组件，可以简单实现一个。以下是一个基本的Reacttoast组件示例importReactfrom'react';import'./Toast.css';//添加样式cons</div>
</li>
<li><a href="/article/8.htm"
title="LeetCode[Math] - #66 Plus One" target="_blank">LeetCode[Math] - #66 Plus One</a>
<span class="text-muted">Cwind</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/LeetCode/1.htm">LeetCode</a><a class="tag" taget="_blank" href="/search/%E9%A2%98%E8%A7%A3/1.htm">题解</a><a class="tag" taget="_blank" href="/search/Algorithm/1.htm">Algorithm</a><a class="tag" taget="_blank" href="/search/Math/1.htm">Math</a>
<div>原题链接：#66 Plus One
要求：
给定一个用数字数组表示的非负整数，如num1 = {1, 2, 3, 9}, num2 = {9, 9}等，给这个数加上1。
注意：
1. 数字的较高位存在数组的头上，即num1表示数字1239
2. 每一位（数组中的每个元素）的取值范围为0~9
难度：简单
分析：
题目比较简单，只须从数组</div>
</li>
<li><a href="/article/135.htm"
title="JQuery中$.ajax()方法参数详解" target="_blank">JQuery中$.ajax()方法参数详解</a>
<span class="text-muted">AILIKES</span>
<a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/jsonp/1.htm">jsonp</a><a class="tag" taget="_blank" href="/search/jquery/1.htm">jquery</a><a class="tag" taget="_blank" href="/search/Ajax/1.htm">Ajax</a><a class="tag" taget="_blank" href="/search/json/1.htm">json</a>
<div>url: 要求为String类型的参数，（默认为当前页地址）发送请求的地址。
type: 要求为String类型的参数，请求方式（post或get）默认为get。注意其他http请求方法，例如put和 delete也可以使用，但仅部分浏览器支持。
timeout: 要求为Number类型的参数，设置请求超时时间（毫秒）。此设置将覆盖$.ajaxSetup()方法的全局</div>
</li>
<li><a href="/article/262.htm"
title="JConsole & JVisualVM远程监视Webphere服务器JVM" target="_blank">JConsole & JVisualVM远程监视Webphere服务器JVM</a>
<span class="text-muted">Kai_Ge</span>
<a class="tag" taget="_blank" href="/search/JVisualVM/1.htm">JVisualVM</a><a class="tag" taget="_blank" href="/search/JConsole/1.htm">JConsole</a><a class="tag" taget="_blank" href="/search/Webphere/1.htm">Webphere</a>
<div> JConsole是JDK里自带的一个工具，可以监测Java程序运行时所有对象的申请、释放等动作，将内存管理的所有信息进行统计、分析、可视化。我们可以根据这些信息判断程序是否有内存泄漏问题。
使用JConsole工具来分析WAS的JVM问题，需要进行相关的配置。
首先我们看WAS服务器端的配置.
1、登录was控制台https://10.4.119.18</div>
</li>
<li><a href="/article/389.htm"
title="自定义annotation" target="_blank">自定义annotation</a>
<span class="text-muted">120153216</span>
<a class="tag" taget="_blank" href="/search/annotation/1.htm">annotation</a>
<div>Java annotation 自定义注释@interface的用法 一、什么是注释
说起注释，得先提一提什么是元数据(metadata)。所谓元数据就是数据的数据。也就是说，元数据是描述数据的。就象数据表中的字段一样，每个字段描述了这个字段下的数据的含义。而J2SE5.0中提供的注释就是java源代码的元数据，也就是说注释是描述java源</div>
</li>
<li><a href="/article/516.htm"
title="CentOS 5/6.X 使用 EPEL YUM源" target="_blank">CentOS 5/6.X 使用 EPEL YUM源</a>
<span class="text-muted">2002wmj</span>
<a class="tag" taget="_blank" href="/search/centos/1.htm">centos</a>
<div>CentOS 6.X 安装使用EPEL YUM源1. 查看操作系统版本[root@node1 ~]# uname -a Linux node1.test.com 2.6.32-358.el6.x86_64 #1 SMP Fri Feb 22 00:31:26 UTC 2013 x86_64 x86_64 x86_64 GNU/Linux [root@node1 ~]#</div>
</li>
<li><a href="/article/643.htm"
title="在SQLSERVER中查找缺失和无用的索引SQL" target="_blank">在SQLSERVER中查找缺失和无用的索引SQL</a>
<span class="text-muted">357029540</span>
<a class="tag" taget="_blank" href="/search/SQL+Server/1.htm">SQL Server</a>
<div>--缺失的索引
SELECT avg_total_user_cost * avg_user_impact * ( user_scans + user_seeks ) AS PossibleImprovement ,
last_user_seek ,
</div>
</li>
<li><a href="/article/770.htm"
title="Spring3 MVC 笔记（二） —json+rest优化" target="_blank">Spring3 MVC 笔记（二） —json+rest优化</a>
<span class="text-muted">7454103</span>
<a class="tag" taget="_blank" href="/search/Spring3+MVC/1.htm">Spring3 MVC</a>
<div>接上次的 spring mvc 注解的一些详细信息！
其实也是一些个人的学习笔记 呵呵！
</div>
</li>
<li><a href="/article/897.htm"
title="替换“\”的时候报错Unexpected internal error near index 1 \ ^" target="_blank">替换“\”的时候报错Unexpected internal error near index 1 \ ^</a>
<span class="text-muted">adminjun</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E2%80%9C%5C%E6%9B%BF%E6%8D%A2%E2%80%9D/1.htm">“\替换”</a>
<div>发现还是有些东西没有刻子脑子里,,过段时间就没什么概念了,所以贴出来...以免再忘...
在拆分字符串时遇到通过 \ 来拆分，可是用所以想通过转义 \\ 来拆分的时候会报异常
public class Main {
/*</div>
</li>
<li><a href="/article/1024.htm"
title="POJ 1035 Spell checker(哈希表)" target="_blank">POJ 1035 Spell checker(哈希表)</a>
<span class="text-muted">aijuans</span>
<a class="tag" taget="_blank" href="/search/%E6%9A%B4%E5%8A%9B%E6%B1%82%E8%A7%A3--%E5%93%88%E5%B8%8C%E8%A1%A8/1.htm">暴力求解--哈希表</a>
<div>/*
题意：输入字典，然后输入单词，判断字典中是否出现过该单词，或者是否进行删除、添加、替换操作，如果是，则输出对应的字典中的单词
要求按照输入时候的排名输出
题解：建立两个哈希表。一个存储字典和输入字典中单词的排名，一个进行最后输出的判重
*/
#include <iostream>
//#define
using namespace std;
const int HASH =</div>
</li>
<li><a href="/article/1151.htm"
title="通过原型实现javascript Array的去重、最大值和最小值" target="_blank">通过原型实现javascript Array的去重、最大值和最小值</a>
<span class="text-muted">ayaoxinchao</span>
<a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/array/1.htm">array</a><a class="tag" taget="_blank" href="/search/prototype/1.htm">prototype</a>
<div>用原型函数（prototype）可以定义一些很方便的自定义函数，实现各种自定义功能。本次主要是实现了Array的去重、获取最大值和最小值。
实现代码如下：
<script type="text/javascript">
Array.prototype.unique = function() {
var a = {};
var le</div>
</li>
<li><a href="/article/1278.htm"
title="UIWebView实现https双向认证请求" target="_blank">UIWebView实现https双向认证请求</a>
<span class="text-muted">bewithme</span>
<a class="tag" taget="_blank" href="/search/UIWebView/1.htm">UIWebView</a><a class="tag" taget="_blank" href="/search/https/1.htm">https</a><a class="tag" taget="_blank" href="/search/Objective-C/1.htm">Objective-C</a>
<div>
什么是HTTPS双向认证我已在先前的博文 ASIHTTPRequest实现https双向认证请求
中有讲述，不理解的读者可以先复习一下。本文是用UIWebView来实现对需要客户端证书验证的服务请求，网上有些文章中有涉及到此内容，但都只言片语，没有讲完全，更没有完整的代码，让人困扰不已。但是此知</div>
</li>
<li><a href="/article/1405.htm"
title="NoSQL数据库之Redis数据库管理(Redis高级应用之事务处理、持久化操作、pub_sub、虚拟内存)" target="_blank">NoSQL数据库之Redis数据库管理(Redis高级应用之事务处理、持久化操作、pub_sub、虚拟内存)</a>
<span class="text-muted">bijian1013</span>
<a class="tag" taget="_blank" href="/search/redis/1.htm">redis</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E5%BA%93/1.htm">数据库</a><a class="tag" taget="_blank" href="/search/NoSQL/1.htm">NoSQL</a>
<div>3.事务处理
Redis对事务的支持目前不比较简单。Redis只能保证一个client发起的事务中的命令可以连续的执行，而中间不会插入其他client的命令。当一个client在一个连接中发出multi命令时，这个连接会进入一个事务上下文，该连接后续的命令不会立即执行，而是先放到一个队列中，当执行exec命令时，redis会顺序的执行队列中</div>
</li>
<li><a href="/article/1532.htm"
title="各数据库分页sql备忘" target="_blank">各数据库分页sql备忘</a>
<span class="text-muted">bingyingao</span>
<a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</a><a class="tag" taget="_blank" href="/search/sql/1.htm">sql</a><a class="tag" taget="_blank" href="/search/%E5%88%86%E9%A1%B5/1.htm">分页</a>
<div>ORACLE
下面这个效率很低
SELECT * FROM ( SELECT A.*, ROWNUM RN FROM (SELECT * FROM IPAY_RCD_FS_RETURN order by id desc) A ) WHERE RN <20;
下面这个效率很高
SELECT A.*, ROWNUM RN FROM (SELECT * FROM IPAY_RCD_</div>
</li>
<li><a href="/article/1659.htm"
title="【Scala七】Scala核心一：函数" target="_blank">【Scala七】Scala核心一：函数</a>
<span class="text-muted">bit1129</span>
<a class="tag" taget="_blank" href="/search/scala/1.htm">scala</a>
<div>1. 如果函数体只有一行代码，则可以不用写{},比如
def print(x: Int) = println(x)
一行上的多条语句用分号隔开，则只有第一句属于方法体，例如
def printWithValue(x: Int) : String= println(x); "ABC"
上面的代码报错，因为，printWithValue的方法</div>
</li>
<li><a href="/article/1786.htm"
title="了解GHC的factorial编译过程" target="_blank">了解GHC的factorial编译过程</a>
<span class="text-muted">bookjovi</span>
<a class="tag" taget="_blank" href="/search/haskell/1.htm">haskell</a>
<div>GHC相对其他主流语言的编译器或解释器还是比较复杂的，一部分原因是haskell本身的设计就不易于实现compiler，如lazy特性，static typed，类型推导等。
关于GHC的内部实现有篇文章说的挺好，这里，文中在RTS一节中详细说了haskell的concurrent实现，里面提到了green thread，如果熟悉Go语言的话就会发现，ghc的concurrent实现和Go有点类</div>
</li>
<li><a href="/article/1913.htm"
title="Java-Collections Framework学习与总结-LinkedHashMap" target="_blank">Java-Collections Framework学习与总结-LinkedHashMap</a>
<span class="text-muted">BrokenDreams</span>
<a class="tag" taget="_blank" href="/search/LinkedHashMap/1.htm">LinkedHashMap</a>
<div> 前面总结了java.util.HashMap，了解了其内部由散列表实现，每个桶内是一个单向链表。那有没有双向链表的实现呢？双向链表的实现会具备什么特性呢？来看一下HashMap的一个子类——java.util.LinkedHashMap。
</div>
</li>
<li><a href="/article/2040.htm"
title="读《研磨设计模式》-代码笔记-抽象工厂模式-Abstract Factory" target="_blank">读《研磨设计模式》-代码笔记-抽象工厂模式-Abstract Factory</a>
<span class="text-muted">bylijinnan</span>
<a class="tag" taget="_blank" href="/search/abstract/1.htm">abstract</a>
<div>声明： 本文只为方便我个人查阅和理解，详细的分析以及源代码请移步 原作者的博客http://chjavach.iteye.com/
package design.pattern;
/*
* Abstract Factory Pattern
* 抽象工厂模式的目的是：
* 通过在抽象工厂里面定义一组产品接口，方便地切换“产品簇”
* 这些接口是相关或者相依赖的</div>
</li>
<li><a href="/article/2167.htm"
title="压暗面部高光" target="_blank">压暗面部高光</a>
<span class="text-muted">cherishLC</span>
<a class="tag" taget="_blank" href="/search/PS/1.htm">PS</a>
<div>方法一、压暗高光&重新着色
当皮肤很油又使用闪光灯时，很容易在面部形成高光区域。
下面讲一下我今天处理高光区域的心得：
皮肤可以分为纹理和色彩两个属性。其中纹理主要由亮度通道（Lab模式的L通道）决定，色彩则由a、b通道确定。
处理思路为在保持高光区域纹理的情况下，对高光区域着色。具体步骤为：降低高光区域的整体的亮度，再进行着色。
如果想简化步骤，可以只进行着色（参看下面的步骤1</div>
</li>
<li><a href="/article/2294.htm"
title="Java VisualVM监控远程JVM" target="_blank">Java VisualVM监控远程JVM</a>
<span class="text-muted">crabdave</span>
<a class="tag" taget="_blank" href="/search/visualvm/1.htm">visualvm</a>
<div>Java VisualVM监控远程JVM
JDK1.6开始自带的VisualVM就是不错的监控工具.
这个工具就在JAVA_HOME\bin\目录下的jvisualvm.exe, 双击这个文件就能看到界面
通过JMX连接远程机器, 需要经过下面的配置:
1. 修改远程机器JDK配置文件 (我这里远程机器是linux).
</div>
</li>
<li><a href="/article/2421.htm"
title="Saiku去掉登录模块" target="_blank">Saiku去掉登录模块</a>
<span class="text-muted">daizj</span>
<a class="tag" taget="_blank" href="/search/saiku/1.htm">saiku</a><a class="tag" taget="_blank" href="/search/%E7%99%BB%E5%BD%95/1.htm">登录</a><a class="tag" taget="_blank" href="/search/olap/1.htm">olap</a><a class="tag" taget="_blank" href="/search/BI/1.htm">BI</a>
<div>
1、修改applicationContext-saiku-webapp.xml
<security:intercept-url pattern="/rest/**" access="IS_AUTHENTICATED_ANONYMOUSLY" />
<security:intercept-url pattern=&qu</div>
</li>
<li><a href="/article/2548.htm"
title="浅析 Flex中的Focus" target="_blank">浅析 Flex中的Focus</a>
<span class="text-muted">dsjt</span>
<a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/Flex/1.htm">Flex</a><a class="tag" taget="_blank" href="/search/Flash/1.htm">Flash</a>
<div>关键字：focus、 setFocus、 IFocusManager、KeyboardEvent
焦点、设置焦点、获得焦点、键盘事件
一、无焦点的困扰——组件监听不到键盘事件
原因：只有获得焦点的组件（确切说是InteractiveObject）才能监听到键盘事件的目标阶段；键盘事件（flash.events.KeyboardEvent）参与冒泡阶段，所以焦点组件的父项（以及它爸</div>
</li>
<li><a href="/article/2675.htm"
title="Yii全局函数使用" target="_blank">Yii全局函数使用</a>
<span class="text-muted">dcj3sjt126com</span>
<a class="tag" taget="_blank" href="/search/yii/1.htm">yii</a>
<div>由于YII致力于完美的整合第三方库，它并没有定义任何全局函数。yii中的每一个应用都需要全类别和对象范围。例如，Yii::app()->user;Yii::app()->params['name'];等等。我们可以自行设定全局函数，使得代码看起来更加简洁易用。(原文地址)
我们可以保存在globals.php在protected目录下。然后，在入口脚本index.php的，我们包括在</div>
</li>
<li><a href="/article/2802.htm"
title="设计模式之单例模式二（解决无序写入的问题）" target="_blank">设计模式之单例模式二（解决无序写入的问题）</a>
<span class="text-muted">come_for_dream</span>
<a class="tag" taget="_blank" href="/search/%E5%8D%95%E4%BE%8B%E6%A8%A1%E5%BC%8F/1.htm">单例模式</a><a class="tag" taget="_blank" href="/search/volatile/1.htm">volatile</a><a class="tag" taget="_blank" href="/search/%E4%B9%B1%E5%BA%8F%E6%89%A7%E8%A1%8C/1.htm">乱序执行</a><a class="tag" taget="_blank" href="/search/%E5%8F%8C%E9%87%8D%E6%A3%80%E9%AA%8C%E9%94%81/1.htm">双重检验锁</a>
<div> 在上篇文章中我们使用了双重检验锁的方式避免懒汉式单例模式下由于多线程造成的实例被多次创建的问题，但是因为由于JVM为了使得处理器内部的运算单元能充分利用，处理器可能会对输入代码进行乱序执行（Out Of Order Execute）优化，处理器会在计算之后将乱序执行的结果进行重组，保证该</div>
</li>
<li><a href="/article/2929.htm"
title="程序员从初级到高级的蜕变" target="_blank">程序员从初级到高级的蜕变</a>
<span class="text-muted">gcq511120594</span>
<a class="tag" taget="_blank" href="/search/%E6%A1%86%E6%9E%B6/1.htm">框架</a><a class="tag" taget="_blank" href="/search/%E5%B7%A5%E4%BD%9C/1.htm">工作</a><a class="tag" taget="_blank" href="/search/PHP/1.htm">PHP</a><a class="tag" taget="_blank" href="/search/android/1.htm">android</a><a class="tag" taget="_blank" href="/search/html5/1.htm">html5</a>
<div>软件开发是一个奇怪的行业，市场远远供不应求。这是一个已经存在多年的问题，而且随着时间的流逝，愈演愈烈。
我们严重缺乏能够满足需求的人才。这个行业相当年轻。大多数软件项目是失败的。几乎所有的项目都会超出预算。我们解决问题的最佳指导方针可以归结为——“用一些通用方法去解决问题，当然这些方法常常不管用，于是，唯一能做的就是不断地尝试，逐个看看是否奏效”。
现在我们把淫浸代码时间超过3年的开发人员称为</div>
</li>
<li><a href="/article/3056.htm"
title="Reverse Linked List" target="_blank">Reverse Linked List</a>
<span class="text-muted">hcx2013</span>
<a class="tag" taget="_blank" href="/search/list/1.htm">list</a>
<div>Reverse a singly linked list.
/**
* Definition for singly-linked list.
* public class ListNode {
* int val;
* ListNode next;
* ListNode(int x) { val = x; }
* }
*/
p</div>
</li>
<li><a href="/article/3183.htm"
title="Spring4.1新特性——数据库集成测试" target="_blank">Spring4.1新特性——数据库集成测试</a>
<span class="text-muted">jinnianshilongnian</span>
<a class="tag" taget="_blank" href="/search/spring+4.1/1.htm">spring 4.1</a>
<div>目录
Spring4.1新特性——综述
Spring4.1新特性——Spring核心部分及其他
Spring4.1新特性——Spring缓存框架增强
Spring4.1新特性——异步调用和事件机制的异常处理
Spring4.1新特性——数据库集成测试脚本初始化
Spring4.1新特性——Spring MVC增强
Spring4.1新特性——页面自动化测试框架Spring MVC T</div>
</li>
<li><a href="/article/3310.htm"
title="C# Ajax上传图片同时生成微缩图(附Demo)" target="_blank">C# Ajax上传图片同时生成微缩图(附Demo)</a>
<span class="text-muted">liyonghui160com</span>
<div>
1.Ajax无刷新上传图片,详情请阅我的这篇文章。（jquery + c# ashx）
2.C#位图处理 System.Drawing。
3.最新demo支持IE7,IE8,Fir</div>
</li>
<li><a href="/article/3437.htm"
title="Java list三种遍历方法性能比较" target="_blank">Java list三种遍历方法性能比较</a>
<span class="text-muted">pda158</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a>
<div>从c/c++语言转向java开发，学习java语言list遍历的三种方法，顺便测试各种遍历方法的性能，测试方法为在ArrayList中插入1千万条记录，然后遍历ArrayList，发现了一个奇怪的现象，测试代码例如以下：
package com.hisense.tiger.list;
import java.util.ArrayList;
import java.util.Iterator;</div>
</li>
<li><a href="/article/3564.htm"
title="300个涵盖IT各方面的免费资源（上）——商业与市场篇" target="_blank">300个涵盖IT各方面的免费资源（上）——商业与市场篇</a>
<span class="text-muted">shoothao</span>
<a class="tag" taget="_blank" href="/search/seo/1.htm">seo</a><a class="tag" taget="_blank" href="/search/%E5%95%86%E4%B8%9A%E4%B8%8E%E5%B8%82%E5%9C%BA/1.htm">商业与市场</a><a class="tag" taget="_blank" href="/search/IT%E8%B5%84%E6%BA%90/1.htm">IT资源</a><a class="tag" taget="_blank" href="/search/%E5%85%8D%E8%B4%B9%E8%B5%84%E6%BA%90/1.htm">免费资源</a>
<div>
A.网站模板+logo+服务器主机+发票生成
HTML5 UP:响应式的HTML5和CSS3网站模板。
Bootswatch:免费的Bootstrap主题。
Templated:收集了845个免费的CSS和HTML5网站模板。
Wordpress.org|Wordpress.com:可免费创建你的新网站。
Strikingly:关注领域中免费无限的移动优</div>
</li>
<li><a href="/article/3691.htm"
title="localStorage、sessionStorage" target="_blank">localStorage、sessionStorage</a>
<span class="text-muted">uule</span>
<a class="tag" taget="_blank" href="/search/localStorage/1.htm">localStorage</a>
<div>W3School 例子
HTML5 提供了两种在客户端存储数据的新方法：
localStorage - 没有时间限制的数据存储
sessionStorage - 针对一个 session 的数据存储
之前，这些都是由 cookie 完成的。但是 cookie 不适合大量数据的存储，因为它们由每个对服务器的请求来传递，这使得 cookie 速度很慢而且效率也不</div>
</li>
</ul>
</div>
</div>
</div>
<div>
<div class="container">
<div class="indexes">
<strong>按字母分类：</strong>
<a href="/tags/A/1.htm" target="_blank">A</a><a href="/tags/B/1.htm" target="_blank">B</a><a href="/tags/C/1.htm" target="_blank">C</a><a
href="/tags/D/1.htm" target="_blank">D</a><a href="/tags/E/1.htm" target="_blank">E</a><a href="/tags/F/1.htm" target="_blank">F</a><a
href="/tags/G/1.htm" target="_blank">G</a><a href="/tags/H/1.htm" target="_blank">H</a><a href="/tags/I/1.htm" target="_blank">I</a><a
href="/tags/J/1.htm" target="_blank">J</a><a href="/tags/K/1.htm" target="_blank">K</a><a href="/tags/L/1.htm" target="_blank">L</a><a
href="/tags/M/1.htm" target="_blank">M</a><a href="/tags/N/1.htm" target="_blank">N</a><a href="/tags/O/1.htm" target="_blank">O</a><a
href="/tags/P/1.htm" target="_blank">P</a><a href="/tags/Q/1.htm" target="_blank">Q</a><a href="/tags/R/1.htm" target="_blank">R</a><a
href="/tags/S/1.htm" target="_blank">S</a><a href="/tags/T/1.htm" target="_blank">T</a><a href="/tags/U/1.htm" target="_blank">U</a><a
href="/tags/V/1.htm" target="_blank">V</a><a href="/tags/W/1.htm" target="_blank">W</a><a href="/tags/X/1.htm" target="_blank">X</a><a
href="/tags/Y/1.htm" target="_blank">Y</a><a href="/tags/Z/1.htm" target="_blank">Z</a><a href="/tags/0/1.htm" target="_blank">其他</a>
</div>
</div>
</div>
<footer id="footer" class="mb30 mt30">
<div class="container">
<div class="footBglm">
<a target="_blank" href="/">首页</a> -
<a target="_blank" href="/custom/about.htm">关于我们</a> -
<a target="_blank" href="/search/Java/1.htm">站内搜索</a> -
<a target="_blank" href="/sitemap.txt">Sitemap</a> -
<a target="_blank" href="/custom/delete.htm">侵权投诉</a>
</div>
<div class="copyright">版权所有 IT知识库 CopyRight © 2000-2050 E-COM-NET.COM , All Rights Reserved.
<!-- <a href="https://beian.miit.gov.cn/" rel="nofollow" target="_blank">京ICP备09083238号</a><br>-->
</div>
</div>
</footer>
<!-- 代码高亮 -->
<script type="text/javascript" src="/static/syntaxhighlighter/scripts/shCore.js"></script>
<script type="text/javascript" src="/static/syntaxhighlighter/scripts/shLegacy.js"></script>
<script type="text/javascript" src="/static/syntaxhighlighter/scripts/shAutoloader.js"></script>
<link type="text/css" rel="stylesheet" href="/static/syntaxhighlighter/styles/shCoreDefault.css"/>
<script type="text/javascript" src="/static/syntaxhighlighter/src/my_start_1.js"></script>
</body>
</html> 