React 实现 textarea 文本域自适应高度(autoSize)

在 React 应用中，有时需要一个文本域（textarea）能够根据输入的内容自动调整其高度。这在创建具有良好用户体验的表单和界面时非常有用。本文将介绍如何使用 React 来实现这一功能。

一、基本原理

textarea 的自适应高度实现原理相对简单：根据文本域中的内容动态调整其 style.height 属性。为了实现这一点，我们需要在文本域的 onChange 事件中添加处理逻辑。

二、实现步骤

1. 创建基础 React 组件

首先，我们创建一个基础的 React 组件，包含一个 textarea 元素。

import React, {useState} from 'react';

function AutoSizeTextarea() {
  const [text, setText] = useState('');

  return (
       setText(e.target.value)}
      />
  );
}

export default AutoSizeTextarea;
</code></pre> 
  <h4>2. 添加自适应高度的逻辑</h4> 
  <p>接下来，我们在 onChange 事件处理函数中添加逻辑以调整 textarea 的高度。</p> 
  <pre><code class="prism language-jsx">function adjustHeight(e) {
  e.target.style.height = 'inherit';
  e.target.style.height = `${e.target.scrollHeight}px`;
}

function AutoSizeTextarea() {
  const [text, setText] = useState('');

  return (
      <textarea
          value={text}
          onChange={(e) => {
            setText(e.target.value);
            adjustHeight(e);
          }}
          style={{minHeight: '50px', overflow: 'hidden'}}
      />
  );
}
</code></pre> 
  <p>在这里，我们首先将 style.height 设置为 ‘inherit’，然后立即设置为 scrollHeight 的值。scrollHeight 是元素内容的总高度，包括因溢出而不可见的部分。</p> 
  <h4>3. 优化和完善</h4> 
  <p>为了避免每次输入都导致不必要的渲染和高度调整，我们可以使用防抖函数来优化这个过程。</p> 
  <pre><code class="prism language-jsx">import { useDebounceFn } from 'ahooks'
import React, {useState, useEffect, useRef} from 'react';

function AutoSizeTextarea() {
   const [text, setText] = useState('');
   const textareaRef = useRef(null);

   const { run } = useDebounceFn(
     (text) => {
        // 调整高度，防抖控制优化
        adjustHeight()
     },
     {
        wait: 500,
     },
   )

  // 使用 lodash 的 debounce 函数创建一个防抖版本的 adjustHeight
  const adjustHeight = () => {
    if (textareaRef.current) {
      textareaRef.current.style.height = 'auto'
      textareaRef.current.style.height = `${textareaRef.current.scrollHeight}px`
    }
  }

  return (
      <textarea
          className="chat-input"
          ref={textareaRef}
          rows="1"
          autoComplete="true"
          placeholder="您可以输入内容向我提问"
          onChange={(e) => {
            let { value } = e.target
            setText(value)
            run(value)
          }}
          style={{minHeight: '50px', overflow: 'hidden'}}
      />
  );
}

export default AutoSizeTextarea;
</code></pre> 
  <p>在这个版本中，我们使用了 ahooks 库中的 useDebounceFn 钩子来创建一个防抖版本的 adjustHeight 函数。这样，我们就可以避免每次输入都导致不必要的渲染和高度调整。</p> 
  <h3>三、结语</h3> 
  <p>通过上述步骤，我们可以在 React 应用中实现一个能够根据内容自适应高度的 textarea 组件。这样的组件提高了用户界面的交互性和用户体验。</p> 
  <hr> 
  <p>欢迎访问：天问博客</p> 
 </div> 
</div>
                            </div>
                        </div>
                    </div>
                    <!--PC和WAP自适应版-->
                    <div id="SOHUCS" sid="1749318976552321024"></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">你可能感兴趣的:(React,react.js,javascript,前端)</h4>
        <div id="paradigm-article-related">
            <div class="recommend-post mb30">
                <ul class="widget-links">
                    <li><a href="/article/1773504513622212608.htm"
                           title="大前端-postcss安装使用指南" target="_blank">大前端-postcss安装使用指南</a>
                        <span class="text-muted">黑夜照亮前行的路</span>
<a class="tag" taget="_blank" href="/search/postcss/1.htm">postcss</a>
                        <div>PostCSS是一款强大的CSS处理工具，可以用来自动添加浏览器前缀、代码合并、代码压缩等，提升代码的可读性，并支持使用最新的CSS语法。以下是一份简化的PostCSS安装使用指南：一、安装PostCSS在你的项目目录中，通过npm（NodePackageManager）来安装PostCSS。打开命令行窗口，输入以下命令：bash复制代码npminstallpostcss--save-dev这将把</div>
                    </li>
                    <li><a href="/article/1773504261557125120.htm"
                           title="谷歌浏览器驱动Chromedriver（114-120版本）文件以及驱动下载教程" target="_blank">谷歌浏览器驱动Chromedriver（114-120版本）文件以及驱动下载教程</a>
                        <span class="text-muted">pigerr杨</span>
<a class="tag" taget="_blank" href="/search/Python/1.htm">Python</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/chrome/1.htm">chrome</a><a class="tag" taget="_blank" href="/search/drivers/1.htm">drivers</a>
                        <div>ChromeDriver官方网站GitHub||GoogleChromeLabs/chrome-for-testingChromeDriver113-125_JSONChromeforTestingavailability123-125zip白月黑羽Python基础|进阶|Qt图形界面|Django|自动化测试|性能测试|JS语言|JS前端|原理与安装</div>
                    </li>
                    <li><a href="/article/1773501994674225152.htm"
                           title="虚拟 DOM 的优缺点有哪些" target="_blank">虚拟 DOM 的优缺点有哪些</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/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>虚拟DOM（VirtualDOM）技术作为现代前端开发中的重要组成部分，已经成为了众多流行前端框架的核心特性。它的引入为前端开发带来了诸多优势，同时也需要我们认真思考其潜在的考量。下面简单的介绍一下虚拟DOM技术的优势与缺点，深入探讨其在实际应用中的影响。提升性能虚拟DOM的最大优势之一是提升页面性能。通过比较前后两次虚拟DOM树的差异，最小化实际DOM操作，从而减少页面重渲染时的性能消耗。这种优</div>
                    </li>
                    <li><a href="/article/1773495574226599936.htm"
                           title="3、JavaWeb-Ajax/Axios-前端工程化-Element" target="_blank">3、JavaWeb-Ajax/Axios-前端工程化-Element</a>
                        <span class="text-muted">所谓远行Misnearch</span>
<a class="tag" taget="_blank" href="/search/%23/1.htm">#</a><a class="tag" taget="_blank" href="/search/JavaWeb/1.htm">JavaWeb</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/ajax/1.htm">ajax</a><a class="tag" taget="_blank" href="/search/elementui/1.htm">elementui</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E6%A1%86%E6%9E%B6/1.htm">前端框架</a>
                        <div>P34Ajax介绍Ajax:AsynchroousJavaScriptAndXML，异步的JS和XMLJS网页动作，XML一种标记语言，存储数据，作用：数据交换：通过Ajax给服务器发送请求，并获取服务器响应的数据异步交互：在不重新加载整个页面的情况下，与服务器交换数据并实现更新部分网页的技术，例如：搜索联想、用户名是否可用的校验等等。同步与异步：同步：服务器在处理中客户端要处于等待状态，输入域名</div>
                    </li>
                    <li><a href="/article/1773403175781466112.htm"
                           title="Python dict字符串转json对象，小数精度丢失问题" target="_blank">Python dict字符串转json对象，小数精度丢失问题</a>
                        <span class="text-muted">朝如青丝 暮成雪</span>
<a class="tag" taget="_blank" href="/search/json/1.htm">json</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a>
                        <div>一前言JSON(JavaScriptObjectNotation)是一种轻量级的数据交换格式，dict是Python的一种数据格式。本篇介绍一个float数据转换时精度丢失的案例。二问题描述importjsontest_str1='{"π":3.1415926535897932384626433832795028841971}'test_str2='{"value":10.00000}'print</div>
                    </li>
                    <li><a href="/article/1773382031552610304.htm"
                           title="java实体中返回前端的double类型四舍五入（格式化）" target="_blank">java实体中返回前端的double类型四舍五入（格式化）</a>
                        <span class="text-muted">婲落ヽ紅顏誶</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a>
                        <div>根据业务，需要通过后端给前端返回部分double类型的数值，一般需要保留两位小数，使用jackson转换对象packagecom.ruoyi.common.core.config;importcom.fasterxml.jackson.core.JsonGenerator;importcom.fasterxml.jackson.databind.JsonSerializer;importcom.f</div>
                    </li>
                    <li><a href="/article/1773360885226602496.htm"
                           title="Django forms组件" target="_blank">Django forms组件</a>
                        <span class="text-muted">在飞行-米龙</span>
<a class="tag" taget="_blank" href="/search/Django/1.htm">Django</a><a class="tag" taget="_blank" href="/search/django/1.htm">django</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/%E5%90%8E%E7%AB%AF/1.htm">后端</a>
                        <div>【一】引入【1】实现登陆验证功能（1）需求分析登陆验证需要前后端交互，采用form表单提交数据对数据进行校验用户名必须以英文大写字母开头密码必须大于三位数反馈给用户错误的信息除了反馈错误的信息还有保留原始输入内容（2）后端代码使用user_info_dict字典每次刷新存储存储前端发送的信息存储后端进行验证的信息defhome(request):#每次后刷新这个信息字典user_info_dict</div>
                    </li>
                    <li><a href="/article/1773308900838277120.htm"
                           title="Web前端Html的表单" target="_blank">Web前端Html的表单</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/html/1.htm">html</a>
                        <div>表单的关键字：form标签表示一个表单区域action=“后端地址”method=“提交数据方式:get/post”input单行输入框type=“text”文本name=“定义名称名字自定义”向后端提交的键readonly=“readonly”只读，不可修改，但是可以提交disabled=“disabled”禁用组件不可修改，不能提交type=“password”密码框type=“radio”单</div>
                    </li>
                    <li><a href="/article/1773279695408791552.htm"
                           title="Thinkphp - 详细实现网站系统登录功能，附带 Mysql 数据库设置、Web 前端展示界面、信息校验等（详细代码，即设计过程）" target="_blank">Thinkphp - 详细实现网站系统登录功能，附带 Mysql 数据库设置、Web 前端展示界面、信息校验等（详细代码，即设计过程）</a>
                        <span class="text-muted">王佳斌</span>
<a class="tag" taget="_blank" href="/search/%2B/1.htm">+</a><a class="tag" taget="_blank" href="/search/Thinkphp/1.htm">Thinkphp</a><a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</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%95%B0%E6%8D%AE%E5%BA%93/1.htm">数据库</a>
                        <div>前言登录功能，是我们几乎开发每个系统都必须的模块。登录功能设计思路，主要包括几个方面。用户输入网址展示登录页面用户输入用户名，密码等点击登录进行信息校验校验通过之后，记录用户登录信息，跳转指定页面用户校验失败，提示失败信息页面目录具体功能实现为了快速搭建可用、美观的页面，我们采用一个比较成熟的前端框架Bootstrap。下面我们到Bootstrap的官网Bootsrap官网下载bootstrap。</div>
                    </li>
                    <li><a href="/article/1773256158274977792.htm"
                           title="javascript 日期转换为时间戳，时间戳转换为日期的函数" target="_blank">javascript 日期转换为时间戳，时间戳转换为日期的函数</a>
                        <span class="text-muted">cdcdhj</span>
<a class="tag" taget="_blank" href="/search/javascript%E5%AD%A6%E4%B9%A0%E6%97%A5%E8%AE%B0/1.htm">javascript学习日记</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><a class="tag" taget="_blank" href="/search/ecmascript/1.htm">ecmascript</a>
                        <div>日期转化为时间戳，主要用valueOf()来进行转化为毫秒时间戳，getTime()IOS系统无法解析转换，所以都有valueOf()letgetTimestampOrDate=function(timestamp){lettimeStamp='';constregex=/^\d{4}(-|\/)\d{2}(-|\/)\d{2}$/;constregex2=/^\d{4}(-|\/)\d{2}(-</div>
                    </li>
                    <li><a href="/article/1773240552423227392.htm"
                           title="react native 总结" target="_blank">react native 总结</a>
                        <span class="text-muted">一切顺势而行</span>
<a class="tag" taget="_blank" href="/search/react/1.htm">react</a><a class="tag" taget="_blank" href="/search/native/1.htm">native</a><a class="tag" taget="_blank" href="/search/react.js/1.htm">react.js</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a>
                        <div>reactapp.js相当与vueapp.vueimportReactfrom'react';import'./App.css';importReactRoutefrom'./router'import{HashRouterasRouter,Link}from'react-router-dom'classAppextendsReact.Component{constructor(props){su</div>
                    </li>
                    <li><a href="/article/1773229094205456384.htm"
                           title="ReactNative应用打包后无网络解决方案" target="_blank">ReactNative应用打包后无网络解决方案</a>
                        <span class="text-muted">程序猿也会飞</span>
<a class="tag" taget="_blank" href="/search/%E6%9C%80%E4%BD%B3%E5%AE%9E%E8%B7%B5/1.htm">最佳实践</a><a class="tag" taget="_blank" href="/search/react/1.htm">react</a><a class="tag" taget="_blank" href="/search/native/1.htm">native</a><a class="tag" taget="_blank" href="/search/android/1.htm">android</a><a class="tag" taget="_blank" href="/search/react.js/1.htm">react.js</a>
                        <div>ReactNative打包应用后，应用没有网络解决方案：在android\app\src\main\res下创建xml文件夹在xml文件夹中创建network_security_config.xml文件network_security_config.xml内容：在android\app\src\main文件夹AndroidManifest.xml文件内的Application标签中添加属性andr</div>
                    </li>
                    <li><a href="/article/1773218897500110848.htm"
                           title="深入理解 React 中的 children props 和 render props" target="_blank">深入理解 React 中的 children props 和 render props</a>
                        <span class="text-muted">JudithHuang</span>
<a class="tag" taget="_blank" href="/search/React/1.htm">React</a><a class="tag" taget="_blank" href="/search/%E4%BB%8E%E5%85%A5%E9%97%A8%E5%88%B0%E6%94%BE%E5%BC%83/1.htm">从入门到放弃</a><a class="tag" taget="_blank" href="/search/react.js/1.htm">react.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>深入理解React中的childrenprops和renderprops在React中，childrenprops和renderprops是两种常见的组件复用模式，它们都可以帮助我们更好地组织和复用组件代码。虽然它们的实现方式有所不同，但都能够有效地实现组件之间的数据传递和功能共享。childrenpropschildrenprops是React中最常见的一种组件复用模式。通过childrenpr</div>
                    </li>
                    <li><a href="/article/1773212227294265344.htm"
                           title="reactive和ref的异同、toRef和toRefs的使用" target="_blank">reactive和ref的异同、toRef和toRefs的使用</a>
                        <span class="text-muted">Niucode</span>
<a class="tag" taget="_blank" href="/search/vue3/1.htm">vue3</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>一、reactive和ref有了reactive为什么还要ref？ref处理起基本数据类型来更加的方便快捷，性能要更好。ref内部值的变化只会触发订阅它的副作用函数（effect）更新，而reactive（Proxy）内部对象的任何属性变化都会触发整个对象的重新渲染。相同点：都是Vue3提供的用于创建响应式数据的函数；在组件中都能够触发视图更新，实现数据的双向绑定。不同点：数据类型：reactiv</div>
                    </li>
                    <li><a href="/article/1773198631940194304.htm"
                           title="COMP315 JavaScript Cloud Computing for E Commerce" target="_blank">COMP315 JavaScript Cloud Computing for E Commerce</a>
                        <span class="text-muted">zhuyu0206girl</span>
<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><a class="tag" taget="_blank" href="/search/ecmascript/1.htm">ecmascript</a>
                        <div>Assignment1:Javascript1IntroductionAcommontaskincloudcomputingisdatacleaning,whichistheprocessoftakinganinitialdatasetthatmaycontainerroneousorincompletedata,andremovingorfixingthoseelementsbeforeform</div>
                    </li>
                    <li><a href="/article/1773191331473063936.htm"
                           title="JSON与AJAX：网页交互的利器" target="_blank">JSON与AJAX：网页交互的利器</a>
                        <span class="text-muted">入冉心</span>
<a class="tag" taget="_blank" href="/search/json/1.htm">json</a><a class="tag" taget="_blank" href="/search/ajax/1.htm">ajax</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a>
                        <div>在现代Web开发中，JSON（JavaScriptObjectNotation）和AJAX（AsynchronousJavaScriptandXML）是两项不可或缺的技术。它们共同为网页提供了动态、实时的数据交互能力，为用户带来了更加流畅和丰富的体验。本文将详细介绍JSON和AJAX的概念、原理，并通过代码示例展示它们在实际开发中的应用。一、JSON：轻量级的数据交换格式JSON是一种轻量级的数据</div>
                    </li>
                    <li><a href="/article/1772795036136701952.htm"
                           title="程序员开发技术整理" target="_blank">程序员开发技术整理</a>
                        <span class="text-muted">laizhixue</span>
<a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E6%A1%86%E6%9E%B6/1.htm">前端框架</a>
                        <div>前端技术：vue-前端框架element-前端框架bootstrap-前端框架echarts-图标组件C#后端技术：webservice：soap架构：简单的通信协议，用于服务通信ORM框架：对象关系映射，如EF：对象实体模型，是ado.net中的应用技术soap服务通讯：xml通讯ado.net：OAuth2:登录授权认证：Token认证：JWT：jsonwebtokenJava后端技术：便捷工</div>
                    </li>
                    <li><a href="/article/1772773132000624640.htm"
                           title="【前端学习——js篇】7.函数缓存" target="_blank">【前端学习——js篇】7.函数缓存</a>
                        <span class="text-muted">笔下无竹墨下有鱼</span>
<a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E5%AD%A6%E4%B9%A0/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/%E5%AD%A6%E4%B9%A0/1.htm">学习</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a>
                        <div>具体见：https://github.com/febobo/web-interview7.函数缓存函数缓存，就是将函数运算过的结果进行缓存本质上就是用空间（缓存存储）换时间（计算过程）常用于缓存数据计算结果和缓存对象。其实现主要通过闭包、柯里化和高阶函数。下面主要介绍下柯里化：①柯里化柯里化（currying)是一种函数式编程的概念，指的是将一个带有多个参数的函数转换成一系列只接受一个参数的函数的</div>
                    </li>
                    <li><a href="/article/1772738346825613312.htm"
                           title="javascript的数据类型及转换" target="_blank">javascript的数据类型及转换</a>
                        <span class="text-muted">田小田txt</span>

                        <div>一、JavaScript数据类型：共有string，number，boolean，object，function五种数据类型；其中Object，Date，Array为对象型；2个不包含任何值的数据类型：null，undefined。二、Typeof查看数据类型：typeof"John"//返回stringtypeof3.14//返回numbertypeofNaN//返回numbertypeoffa</div>
                    </li>
                    <li><a href="/article/1772709062681624576.htm"
                           title="html版本号 webpack_html-webpack-plugin详解" target="_blank">html版本号 webpack_html-webpack-plugin详解</a>
                        <span class="text-muted">weixin_39994949</span>
<a class="tag" taget="_blank" href="/search/html%E7%89%88%E6%9C%AC%E5%8F%B7/1.htm">html版本号</a><a class="tag" taget="_blank" href="/search/webpack/1.htm">webpack</a>
                        <div>引言最近在react项目中初次用到了html-webapck-plugin插件，用到该插件的两个主要作用：为html文件中引入的外部资源如script、link动态添加每次compile后的hash，防止引用缓存的外部文件问题可以生成创建html入口文件，比如单页面可以生成一个html文件入口，配置N个html-webpack-plugin可以生成N个页面入口有了这种插件，那么在项目中遇到类似上面</div>
                    </li>
                    <li><a href="/article/1772673815097180160.htm"
                           title="Websocket服务监听收发消息" target="_blank">Websocket服务监听收发消息</a>
                        <span class="text-muted">beiback</span>
<a class="tag" taget="_blank" href="/search/Java/1.htm">Java</a><a class="tag" taget="_blank" href="/search/%E6%9C%8D%E5%8A%A1%E5%99%A8%E9%97%AE%E9%A2%98/1.htm">服务器问题</a><a class="tag" taget="_blank" href="/search/websocket/1.htm">websocket</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C%E5%8D%8F%E8%AE%AE/1.htm">网络协议</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C/1.htm">网络</a>
                        <div>目录1.pom依赖坐标2.项目配置端口和项目包名2.创建处理器3.注册处理器4.前端页面1.pom依赖坐标org.springframework.bootspring-boot-starter-websocket2.项目配置端口和项目包名application.propertiesserver.port=8088//路径规范：为应用的所有servlet提供一个统一的前缀，使URL结构更加清晰和一致</div>
                    </li>
                    <li><a href="/article/1772673816238030848.htm"
                           title="Netty服务器结合WebSocke协议监听和接收数据" target="_blank">Netty服务器结合WebSocke协议监听和接收数据</a>
                        <span class="text-muted">beiback</span>
<a class="tag" taget="_blank" href="/search/%E6%9C%8D%E5%8A%A1%E5%99%A8%E9%97%AE%E9%A2%98/1.htm">服务器问题</a><a class="tag" taget="_blank" href="/search/Java/1.htm">Java</a><a class="tag" taget="_blank" href="/search/%E6%9C%8D%E5%8A%A1%E5%99%A8/1.htm">服务器</a><a class="tag" taget="_blank" href="/search/%E8%BF%90%E7%BB%B4/1.htm">运维</a><a class="tag" taget="_blank" href="/search/netty/1.htm">netty</a>
                        <div>目录1.pom依赖2.配置属性3.创建netty服务器4.建立监听和响应5.创建启动器6.前端static下页面7.前端js8.注意异常问题9.创建netty服务器--使用守护线程1.pom依赖io.nettynetty-all4.1.86.Final2.配置属性application.properties#启动端口server.port=8088server.servlet.context-pa</div>
                    </li>
                    <li><a href="/article/1772654174425645056.htm"
                           title="基于SSM+Vue企业销售培训系统 企业人才培训系统 企业课程培训管理系统 企业文化培训班系统Java" target="_blank">基于SSM+Vue企业销售培训系统 企业人才培训系统 企业课程培训管理系统 企业文化培训班系统Java</a>
                        <span class="text-muted">计算机程序老哥</span>

                        <div>作者主页：计算机毕业设计老哥有问题可以主页问我一、开发介绍1.1开发环境开发语言：Java数据库：MySQL系统架构：B/S后端：SSM(Spring+SpringMVC+Mybatis)前端：Vue工具：IDEA或者Eclipse，JDK1.8，Maven二、系统介绍2.1图片展示注册登录页面：登陆.png前端页面功能：首页、培训班、在线学习、企业文化、交流论坛、试卷列表、系统公告、留言反馈、个</div>
                    </li>
                    <li><a href="/article/1772631263593693184.htm"
                           title="javascript实现SM2加密解密" target="_blank">javascript实现SM2加密解密</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/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/jquery/1.htm">jquery</a>
                        <div>前提JavaWeb环境前端代码window.sm2=function(t){functioni(e){if(r[e])returnr[e].exports;varn=r[e]={i:e,l:!1,exports:{}};returnt[e].call(n.exports,n,n.exports,i),n.l=!0,n.exports}varr={};returni.m=t,i.c=r,i.d=fu</div>
                    </li>
                    <li><a href="/article/1772618299398488064.htm"
                           title="Vue：为什么要使用v-cloak" target="_blank">Vue：为什么要使用v-cloak</a>
                        <span class="text-muted">刻刻帝的海角</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>Vue.js是一种流行的JavaScript框架，它使我们能够构建交互性强大的用户界面。在Vue.js中，v-cloak是一个指令，用于解决在页面加载时出现的闪烁问题。本文将介绍如何使用v-cloak及代码来优化Vue.js应用程序的渲染效果。引言当我们使用Vue.js构建应用程序时，有时会遇到一个问题：在页面加载时，由于Vue.js需要一定的时间来解析和渲染模板，会导致页面上显示出未经处理的Mu</div>
                    </li>
                    <li><a href="/article/1772594886269272064.htm"
                           title="JavaScript快速入门笔记之二（变量、常量、数据类型）" target="_blank">JavaScript快速入门笔记之二（变量、常量、数据类型）</a>
                        <span class="text-muted">eshineLau</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/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E7%AC%94%E8%AE%B0/1.htm">笔记</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a>
                        <div>JavaScript快速入门笔记之二（变量、常量、数据类型）1、变量何时使用变量：程序中的一切数据都要保存在变量中，反复使用如何使用变量：2种情况：赋值和取值赋值：2步：1.1创建变量：——声明——创建一个新的空变量语法：var变量名;强调：仅声明，未赋值的变量，默认值是undefined命名：1.不能以数字开头2.不能用保留字。3.一般采用驼峰命名1.2赋值：将数据保存到变量中语法：变量名=数据</div>
                    </li>
                    <li><a href="/article/1772541266194661376.htm"
                           title="前端埋点解决方案" target="_blank">前端埋点解决方案</a>
                        <span class="text-muted">zhu_zhu_xia</span>
<a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a>
                        <div>一、前言：基于神策数据的前端埋点解决方案JavaScript快速使用·神策分析使用手册[预览版]二、sdkgitlab下载地址https://github.com/sensorsdata/sa-sdk-javascript/releases或者npm安装npmisa-sdk-javascript三、入门3.1接入sdk以及配置(version1.17.2)，入口文件接入sdk以及添加配置(func</div>
                    </li>
                    <li><a href="/article/1772500355632922624.htm"
                           title="vue时间组件：dayjs与moment" target="_blank">vue时间组件：dayjs与moment</a>
                        <span class="text-muted">煸橙干儿~~</span>
<a class="tag" taget="_blank" href="/search/VUE%E5%AE%9E%E6%88%98/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>一、dayjs使用Day.js是一个极简的JavaScript库，可以为现代浏览器解析、验证、操作和显示日期和时间。具体使用可参考：dayjs官网1、本年start=dayjs().startOf('year').format('YYYY-MM-DD')end=dayjs().endOf('year').format('YYYY-MM-DD')console.log(start,end)//['2</div>
                    </li>
                    <li><a href="/article/1772488521790062592.htm"
                           title="11 React 组件通信 父传子" target="_blank">11 React 组件通信 父传子</a>
                        <span class="text-muted">a457636876</span>
<a class="tag" taget="_blank" href="/search/React/1.htm">React</a><a class="tag" taget="_blank" href="/search/react.js/1.htm">react.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>在React中实现组件通信是非常常见的需求，其中包括父子组件通信。以下是几种常见的父子组件通信的例子，以及需要注意的知识：Props传递：这是最基本的父子组件通信方式。父组件通过props将数据传递给子组件。//ParentComponent.jsimportReactfrom'react';importChildComponentfrom'./ChildComponent';functionPa</div>
                    </li>
                    <li><a href="/article/1772399131164213248.htm"
                           title="如何提出令人爱回答的好问题？" target="_blank">如何提出令人爱回答的好问题？</a>
                        <span class="text-muted">兮若耶</span>

                        <div>我们经常会遇到这样的问题，如我适合做什么？这个名词怎么解释？大部分人面对这样的问题时，要么答非所问，要么无从下手。现在的很多事物都是速成的，只是好的问题并没有那么容易被提出来。而提不好的问题，可能会拿不到想要的信息等等。所以提出一个好问题很重要。01提问的功能我们参加各种聚会、会议时，能听到很多的比喻和新观点，而这些是在书上和网上找不到的。这些新的有用的东西，都在前端被实践着，暂时来不及把知识系统</div>
                    </li>
                                <li><a href="/article/19.htm"
                                       title="解线性方程组" target="_blank">解线性方程组</a>
                                    <span class="text-muted">qiuwanchi</span>

                                    <div>package gaodai.matrix;

import java.util.ArrayList;
import java.util.List;
import java.util.Scanner;

public class Test {

	public static void main(String[] args) {
		Scanner scanner = new Sc</div>
                                </li>
                                <li><a href="/article/146.htm"
                                       title="在mysql内部存储代码" target="_blank">在mysql内部存储代码</a>
                                    <span class="text-muted">annan211</span>
<a class="tag" taget="_blank" href="/search/%E6%80%A7%E8%83%BD/1.htm">性能</a><a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a><a class="tag" taget="_blank" href="/search/%E5%AD%98%E5%82%A8%E8%BF%87%E7%A8%8B/1.htm">存储过程</a><a class="tag" taget="_blank" href="/search/%E8%A7%A6%E5%8F%91%E5%99%A8/1.htm">触发器</a>
                                    <div>

在mysql内部存储代码
  在mysql内部存储代码，既有优点也有缺点，而且有人倡导有人反对。
  先看优点：
  1 她在服务器内部执行，离数据最近，另外在服务器上执行还可以节省带宽和网络延迟。
  2 这是一种代码重用。可以方便的统一业务规则，保证某些行为的一致性，所以也可以提供一定的安全性。
  3 可以简化代码的维护和版本更新。
  4 可以帮助提升安全，比如提供更细</div>
                                </li>
                                <li><a href="/article/273.htm"
                                       title="Android使用Asynchronous Http Client完成登录保存cookie的问题" target="_blank">Android使用Asynchronous Http Client完成登录保存cookie的问题</a>
                                    <span class="text-muted">hotsunshine</span>
<a class="tag" taget="_blank" href="/search/android/1.htm">android</a>
                                    <div>Asynchronous Http Client是android中非常好的异步请求工具 
除了异步之外还有很多封装比如json的处理，cookie的处理 
 
  引用   
 
Persistent Cookie Storage with PersistentCookieStore 
 
This library also includes a PersistentCookieStore whi</div>
                                </li>
                                <li><a href="/article/400.htm"
                                       title="java面试题" target="_blank">java面试题</a>
                                    <span class="text-muted">Array_06</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E9%9D%A2%E8%AF%95/1.htm">面试</a>
                                    <div>java面试题 
 
 
第一，谈谈final, finally, finalize的区别。 
final-修饰符（关键字）如果一个类被声明为final，意味着它不能再派生出新的子类，不能作为父类被继承。因此一个类不能既被声明为 abstract的，又被声明为final的。将变量或方法声明为final，可以保证它们在使用中不被改变。被声明为final的变量必须在声明时给定初值，而在以后的引用中只能</div>
                                </li>
                                <li><a href="/article/527.htm"
                                       title="网站加速" target="_blank">网站加速</a>
                                    <span class="text-muted">oloz</span>
<a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%AB%99%E5%8A%A0%E9%80%9F/1.htm">网站加速</a>
                                    <div>前序:本人菜鸟，此文研究总结来源于互联网上的资料，大牛请勿喷！本人虚心学习，多指教. 
 
 
1、减小网页体积的大小，尽量采用div+css模式，尽量避免复杂的页面结构，能简约就简约。 
 
 
2、采用Gzip对网页进行压缩； 
   GZIP最早由Jean-loup Gailly和Mark Adler创建，用于UNⅨ系统的文件压缩。我们在Linux中经常会用到后缀为.gz</div>
                                </li>
                                <li><a href="/article/654.htm"
                                       title="正确书写单例模式" target="_blank">正确书写单例模式</a>
                                    <span class="text-muted">随意而生</span>
<a class="tag" taget="_blank" href="/search/java+%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F+%E5%8D%95%E4%BE%8B/1.htm">java 设计模式 单例</a>
                                    <div>　　单例模式算是设计模式中最容易理解，也是最容易手写代码的模式了吧。但是其中的坑却不少，所以也常作为面试题来考。本文主要对几种单例写法的整理，并分析其优缺点。很多都是一些老生常谈的问题，但如果你不知道如何创建一个线程安全的单例，不知道什么是双检锁，那这篇文章可能会帮助到你。 
 
　　懒汉式，线程不安全 
 
　　当被问到要实现一个单例模式时，很多人的第一反应是写出如下的代码，包括教科书上也是这样</div>
                                </li>
                                <li><a href="/article/781.htm"
                                       title="单例模式" target="_blank">单例模式</a>
                                    <span class="text-muted">香水浓</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a>
                                    <div>懒汉  调用getInstance方法时实例化 
 

public class Singleton {

	private static Singleton instance;
	
	private Singleton() {}

	public static synchronized Singleton getInstance() {
		if(null == ins</div>
                                </li>
                                <li><a href="/article/908.htm"
                                       title="安装Apache问题：系统找不到指定的文件 No installed service named "Apache2"" target="_blank">安装Apache问题：系统找不到指定的文件 No installed service named "Apache2"</a>
                                    <span class="text-muted">AdyZhang</span>
<a class="tag" taget="_blank" href="/search/apache/1.htm">apache</a><a class="tag" taget="_blank" href="/search/http+server/1.htm">http server</a>
                                    <div>安装Apache问题：系统找不到指定的文件 No installed service named "Apache2" 
每次到这一步都很小心防它的端口冲突问题，结果，特意留出来的80端口就是不能用，烦。 
解决方法确保几处： 
1、停止IIS启动 
2、把端口80改成其它 （譬如90，800，，，什么数字都好） 
3、防火墙(关掉试试) 
在运行处输入 cmd 回车，转到apa</div>
                                </li>
                                <li><a href="/article/1035.htm"
                                       title="如何在android 文件选择器中选择多个图片或者视频？" target="_blank">如何在android 文件选择器中选择多个图片或者视频？</a>
                                    <span class="text-muted">aijuans</span>
<a class="tag" taget="_blank" href="/search/android/1.htm">android</a>
                                    <div>我的android app有这样的需求，在进行照片和视频上传的时候，需要一次性的从照片/视频库选择多条进行上传 
但是android原生态的sdk中，只能一个一个的进行选择和上传。 
我想知道是否有其他的android上传库可以解决这个问题，提供一个多选的功能，可以使checkbox之类的，一次选择多个   处理方法 
官方的图片选择器(但是不支持所有版本的androi，只支持API Level </div>
                                </li>
                                <li><a href="/article/1162.htm"
                                       title="mysql中查询生日提醒的日期相关的sql" target="_blank">mysql中查询生日提醒的日期相关的sql</a>
                                    <span class="text-muted">baalwolf</span>
<a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a>
                                    <div>SELECT sysid,user_name,birthday,listid,userhead_50,CONCAT(YEAR(CURDATE()),DATE_FORMAT(birthday,'-%m-%d')),CURDATE(),  dayofyear( CONCAT(YEAR(CURDATE()),DATE_FORMAT(birthday,'-%m-%d')))-dayofyear(</div>
                                </li>
                                <li><a href="/article/1289.htm"
                                       title="MongoDB索引文件破坏后导致查询错误的问题" target="_blank">MongoDB索引文件破坏后导致查询错误的问题</a>
                                    <span class="text-muted">BigBird2012</span>
<a class="tag" taget="_blank" href="/search/mongodb/1.htm">mongodb</a>
                                    <div>问题描述： 
MongoDB在非正常情况下关闭时，可能会导致索引文件破坏，造成数据在更新时没有反映到索引上。 
解决方案： 
  
使用脚本，重建MongoDB所有表的索引。 
var names  = db.getCollectionNames();
for( var i in names ){
    var name = names[i];
    print(name);
</div>
                                </li>
                                <li><a href="/article/1416.htm"
                                       title="Javascript Promise" target="_blank">Javascript Promise</a>
                                    <span class="text-muted">bijian1013</span>
<a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/Promise/1.htm">Promise</a>
                                    <div>        Parse JavaScript SDK现在提供了支持大多数异步方法的兼容jquery的Promises模式，那么这意味着什么呢，读完下文你就了解了。 
一.认识Promises 
        “Promises”代表着在javascript程序里下一个伟大的范式，但是理解他们为什么如此伟大不是件简</div>
                                </li>
                                <li><a href="/article/1543.htm"
                                       title="[Zookeeper学习笔记九]Zookeeper源代码分析之Zookeeper构造过程" target="_blank">[Zookeeper学习笔记九]Zookeeper源代码分析之Zookeeper构造过程</a>
                                    <span class="text-muted">bit1129</span>
<a class="tag" taget="_blank" href="/search/zookeeper/1.htm">zookeeper</a>
                                    <div>   Zookeeper重载了几个构造函数，其中构造者可以提供参数最多，可定制性最多的构造函数是   
  
public ZooKeeper(String connectString, int sessionTimeout, Watcher watcher, long sessionId, byte[] sessionPasswd, boolea</div>
                                </li>
                                <li><a href="/article/1670.htm"
                                       title="【Java命令三】jstack" target="_blank">【Java命令三】jstack</a>
                                    <span class="text-muted">bit1129</span>
<a class="tag" taget="_blank" href="/search/jstack/1.htm">jstack</a>
                                    <div>jstack是用于获得当前运行的Java程序所有的线程的运行情况(thread dump），不同于jmap用于获得memory dump 
  
[hadoop@hadoop sbin]$ jstack
Usage:
    jstack [-l] <pid>
        (to connect to running process)
    jstack -F </div>
                                </li>
                                <li><a href="/article/1797.htm"
                                       title="jboss 5.1启停脚本　动静分离部署" target="_blank">jboss 5.1启停脚本　动静分离部署</a>
                                    <span class="text-muted">ronin47</span>

                                    <div>以前启动jboss，往各种xml配置文件，现只要运行一句脚本即可。start nohup sh /**/run.sh -c servicename  -b ip -g  clustername   -u broatcast jboss.messaging.ServerPeerID=int  -Djboss.service.binding.set=p</div>
                                </li>
                                <li><a href="/article/1924.htm"
                                       title="UI之如何打磨设计能力?" target="_blank">UI之如何打磨设计能力?</a>
                                    <span class="text-muted">brotherlamp</span>
<a class="tag" taget="_blank" href="/search/UI/1.htm">UI</a><a class="tag" taget="_blank" href="/search/ui%E6%95%99%E7%A8%8B/1.htm">ui教程</a><a class="tag" taget="_blank" href="/search/ui%E8%87%AA%E5%AD%A6/1.htm">ui自学</a><a class="tag" taget="_blank" href="/search/ui%E8%B5%84%E6%96%99/1.htm">ui资料</a><a class="tag" taget="_blank" href="/search/ui%E8%A7%86%E9%A2%91/1.htm">ui视频</a>
                                    <div>  
在越来越拥挤的初创企业世界里，视觉设计的重要性往往可以与杀手级用户体验比肩。在许多情况下，尤其对于 Web 初创企业而言，这两者都是不可或缺的。前不久我们在《右脑革命：别学编程了，学艺术吧》中也曾发出过重视设计的呼吁。如何才能提高初创企业的设计能力呢?以下是 9 位创始人的体会。 
1.找到自己的方式 
如果你是设计师，要想提高技能可以去设计博客和展示好设计的网站如D-lists或</div>
                                </li>
                                <li><a href="/article/2051.htm"
                                       title="三色旗算法" target="_blank">三色旗算法</a>
                                    <span class="text-muted">bylijinnan</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a>
                                    <div>

import java.util.Arrays;

/**
问题：
假设有一条绳子，上面有红、白、蓝三种颜色的旗子，起初绳子上的旗子颜色并没有顺序，
您希望将之分类，并排列为蓝、白、红的顺序，要如何移动次数才会最少，注意您只能在绳
子上进行这个动作，而且一次只能调换两个旗子。

网上的解法大多类似：
在一条绳子上移动，在程式中也就意味只能使用一个阵列，而不使用其它的阵列来</div>
                                </li>
                                <li><a href="/article/2178.htm"
                                       title="警告:No configuration found for the specified action: \'s" target="_blank">警告:No configuration found for the specified action: \'s</a>
                                    <span class="text-muted">chiangfai</span>
<a class="tag" taget="_blank" href="/search/configuration/1.htm">configuration</a>
                                    <div>1.index.jsp页面form标签未指定namespace属性。 
<!--index.jsp代码--> 
 
<%@taglib prefix="s" uri="/struts-tags"%>
...
<s:form action="submit" method="post"&g</div>
                                </li>
                                <li><a href="/article/2305.htm"
                                       title="redis -- hash_max_zipmap_entries设置过大有问题" target="_blank">redis -- hash_max_zipmap_entries设置过大有问题</a>
                                    <span class="text-muted">chenchao051</span>
<a class="tag" taget="_blank" href="/search/redis/1.htm">redis</a><a class="tag" taget="_blank" href="/search/hash/1.htm">hash</a>
                                    <div>使用redis时为了使用hash追求更高的内存使用率，我们一般都用hash结构，并且有时候会把hash_max_zipmap_entries这个值设置的很大，很多资料也推荐设置到1000，默认设置为了512，但是这里有个坑 
  
#define ZIPMAP_BIGLEN 254
#define ZIPMAP_END 255 
  
  
/* Return th</div>
                                </li>
                                <li><a href="/article/2432.htm"
                                       title="select into outfile access deny问题" target="_blank">select into outfile access deny问题</a>
                                    <span class="text-muted">daizj</span>
<a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a><a class="tag" taget="_blank" href="/search/txt/1.htm">txt</a><a class="tag" taget="_blank" href="/search/%E5%AF%BC%E5%87%BA%E6%95%B0%E6%8D%AE%E5%88%B0%E6%96%87%E4%BB%B6/1.htm">导出数据到文件</a>
                                    <div>本文转自：http://hatemysql.com/2010/06/29/select-into-outfile-access-deny%E9%97%AE%E9%A2%98/ 
 
为应用建立了rnd的帐号，专门为他们查询线上数据库用的，当然，只有他们上了生产网络以后才能连上数据库，安全方面我们还是很注意的，呵呵。 
授权的语句如下： 
grant select on armory.* to rn</div>
                                </li>
                                <li><a href="/article/2559.htm"
                                       title="phpexcel导出excel表简单入门示例" target="_blank">phpexcel导出excel表简单入门示例</a>
                                    <span class="text-muted">dcj3sjt126com</span>
<a class="tag" taget="_blank" href="/search/PHP/1.htm">PHP</a><a class="tag" taget="_blank" href="/search/Excel/1.htm">Excel</a><a class="tag" taget="_blank" href="/search/phpexcel/1.htm">phpexcel</a>
                                    <div>  
<?php 
error_reporting(E_ALL); 
ini_set('display_errors', TRUE); 
ini_set('display_startup_errors', TRUE); 
  
if (PHP_SAPI == 'cli') 
 die('This example should only be run from a Web Brows</div>
                                </li>
                                <li><a href="/article/2686.htm"
                                       title="美国电影超短200句" target="_blank">美国电影超短200句</a>
                                    <span class="text-muted">dcj3sjt126com</span>
<a class="tag" taget="_blank" href="/search/%E7%94%B5%E5%BD%B1/1.htm">电影</a>
                                    <div>1. I see． 我明白了。2. I quit! 我不干了!3. Let go! 放手!4. Me too． 我也是。5. My god! 天哪!6. No way! 不行!7. Come on． 来吧(赶快)8. Hold on． 等一等。9. I agree。 我同意。10. Not bad． 还不错。11. Not yet． 还没。12. See you． 再见。13. Shut up! </div>
                                </li>
                                <li><a href="/article/2813.htm"
                                       title="Java访问远程服务" target="_blank">Java访问远程服务</a>
                                    <span class="text-muted">dyy_gusi</span>
<a class="tag" taget="_blank" href="/search/httpclient/1.htm">httpclient</a><a class="tag" taget="_blank" href="/search/webservice/1.htm">webservice</a><a class="tag" taget="_blank" href="/search/get/1.htm">get</a><a class="tag" taget="_blank" href="/search/post/1.htm">post</a>
                                    <div>    随着webService的崛起，我们开始中会越来越多的使用到访问远程webService服务。当然对于不同的webService框架一般都有自己的client包供使用，但是如果使用webService框架自己的client包，那么必然需要在自己的代码中引入它的包，如果同时调运了多个不同框架的webService，那么就需要同时引入多个不同的clien</div>
                                </li>
                                <li><a href="/article/2940.htm"
                                       title="Maven的settings.xml配置" target="_blank">Maven的settings.xml配置</a>
                                    <span class="text-muted">geeksun</span>
<a class="tag" taget="_blank" href="/search/settings.xml/1.htm">settings.xml</a>
                                    <div>settings.xml是Maven的配置文件，下面解释一下其中的配置含义： 
settings.xml存在于两个地方： 
1.安装的地方：$M2_HOME/conf/settings.xml 
2.用户的目录：${user.home}/.m2/settings.xml 
前者又被叫做全局配置，后者被称为用户配置。如果两者都存在，它们的内容将被合并，并且用户范围的settings.xml优先。 
</div>
                                </li>
                                <li><a href="/article/3067.htm"
                                       title="ubuntu的init与系统服务设置" target="_blank">ubuntu的init与系统服务设置</a>
                                    <span class="text-muted">hongtoushizi</span>
<a class="tag" taget="_blank" href="/search/ubuntu/1.htm">ubuntu</a>
                                    <div>转载自： 
http://iysm.net/?p=178  init 
Init是位于/sbin/init的一个程序，它是在linux下，在系统启动过程中，初始化所有的设备驱动程序和数据结构等之后，由内核启动的一个用户级程序，并由此init程序进而完成系统的启动过程。 
ubuntu与传统的linux略有不同，使用upstart完成系统的启动，但表面上仍维持init程序的形式。  
运行</div>
                                </li>
                                <li><a href="/article/3194.htm"
                                       title="跟我学Nginx+Lua开发目录贴" target="_blank">跟我学Nginx+Lua开发目录贴</a>
                                    <span class="text-muted">jinnianshilongnian</span>
<a class="tag" taget="_blank" href="/search/nginx/1.htm">nginx</a><a class="tag" taget="_blank" href="/search/lua/1.htm">lua</a>
                                    <div>使用Nginx+Lua开发近一年的时间，学习和实践了一些Nginx+Lua开发的架构，为了让更多人使用Nginx+Lua架构开发，利用春节期间总结了一份基本的学习教程，希望对大家有用。也欢迎谈探讨学习一些经验。  
  目录 
第一章 安装Nginx+Lua开发环境 
第二章 Nginx+Lua开发入门 
第三章 Redis/SSDB+Twemproxy安装与使用 
第四章 L</div>
                                </li>
                                <li><a href="/article/3321.htm"
                                       title="php位运算符注意事项" target="_blank">php位运算符注意事项</a>
                                    <span class="text-muted">home198979</span>
<a class="tag" taget="_blank" href="/search/%E4%BD%8D%E8%BF%90%E7%AE%97/1.htm">位运算</a><a class="tag" taget="_blank" href="/search/PHP/1.htm">PHP</a><a class="tag" taget="_blank" href="/search/%26/1.htm">&</a>
                                    <div>$a = $b = $c = 0;
$a & $b = 1;
$b | $c = 1 
 问a,b,c最终为多少? 
  
当看到这题时，我犯了一个低级错误，误 以为位运算符会改变变量的值。所以得出结果是1 1 0 
但是位运算符是不会改变变量的值的，例如： 
$a=1;$b=2;
$a&$b;
 
 这样a,b的值不会有任何改变 
</div>
                                </li>
                                <li><a href="/article/3448.htm"
                                       title="Linux shell数组建立和使用技巧" target="_blank">Linux shell数组建立和使用技巧</a>
                                    <span class="text-muted">pda158</span>
<a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a>
                                    <div>1.数组定义   　　[chengmo@centos5 ~]$ a=(1 2 3 4 5)   　　[chengmo@centos5 ~]$ echo $a   　　1   　　一对括号表示是数组，数组元素用“空格”符号分割开。   　　 
2.数组读取与赋值   　　得到长度：   　　[chengmo@centos5 ~]$ echo ${#a[@]}   　　5   　　用${#数组名[@或</div>
                                </li>
                                <li><a href="/article/3575.htm"
                                       title="hotspot源码(JDK7)" target="_blank">hotspot源码(JDK7)</a>
                                    <span class="text-muted">ol_beta</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/HotSpot/1.htm">HotSpot</a><a class="tag" taget="_blank" href="/search/jvm/1.htm">jvm</a>
                                    <div>源码结构图，方便理解： 
  
├─agent                            Serviceab</div>
                                </li>
                                <li><a href="/article/3702.htm"
                                       title="Oracle基本事务和ForAll执行批量DML练习" target="_blank">Oracle基本事务和ForAll执行批量DML练习</a>
                                    <span class="text-muted">vipbooks</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>
                                    <div>基本事务的使用： 
从账户一的余额中转100到账户二的余额中去，如果账户二不存在或账户一中的余额不足100则整笔交易回滚 
 
 

select * from account;
-- 创建一张账户表
create table account(
       -- 账户ID
       id number(3) not null,
       -- 账户名称
       nam</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>