前言：
最近在做一个权限管理的后台项目，经常涉及到树形数据展示，就用到了antd，table表格树形数据组件。记录一下使用过程的坑。
环境及配置：
antd -3.23.6(大版本为antd 3) 官方antd 3版本API文档
antd 3和antd 4版本对于表格来说变动很小只是把展开配置放到了一个expandable的对象里，所以只需要稍微变动就可以运用到antd v4版本
antd Table树形数据展示及使用
使用很简单只需要数据是树形结构的就可以（一般都是children为标志，如果不是可以使用childrenColumnName树形指定key名，api文档里写的很清楚）。
1.自定义展开收起图标：
业务要求需要自定义展开收起（默认的不太好看）
实现思路：
利用 expandIcon，判断是否可以展开来实现
import React, { Component } from 'react';
import { Table, Divider, Tag,Icon } from 'antd';
const data=[
{
name:"破阵",
age:"32",
tel:"5555",
leve:1,
children:[
{
name:"山鬼谣",
age:"18",
tel:"55554",
leve:2,
children:[
{
name:"弋痕夕",
age:"34",
tel:"55554",
leve:3,
}
]
},
{
name:"天净沙",
age:"45",
tel:"555549",
leve:2,
}
]
},
{
name:"辗迟",
age:"18",
tel:"5555",
leve:1,
children:[]
}
];
const coumns=[
{
title: 'name',
dataIndex: 'name',
key: 'name',
render: text => {text} ,
},
{
title: 'age',
dataIndex: 'age',
key: 'age',
render: text => {text} ,
},
{
title: 'tel',
dataIndex: 'tel',
key: 'tel',
render: text => {text} ,
},
];
class index extends Component {
render() {
return (
{ //expanded-是否可展开, onExpand-展开事件默认, record-每一项的值 设置自定义图标
if(expanded){//根据是否可以展开判断
return onExpand(record, e)}/>
}else{
return onExpand(record, e)}/>
}
}}
/>
);
}
}
export default index;
2.业务要求默认展开
要知道antd里只要和default沾边的都只是初次渲染管用（比如给input设置默认值等等），所以官方给的是expandedRowKeys和onExpand结合实现。
实现思路：
expandedRowKeys和onExpand结合实现。判断是否展开，动态改变expandedRowKeys。
注意数据里的key必须是唯一的，否则会出现展开一个另一个也跟着展开 （当然如果需求就是联动可以相同）。
先加上expandedRowKeys默认是展开了，但是会出现点击展开和折叠就不生效了，所以要结合onExpand实现（使用这个默认的就不生效了，默认没有子项是不展示图标的，所以还要加一个判断）
class index extends Component {
state = {
expandedRowKeys: []
}
componentDidMount() {
let keyArr = [];
data.map((item, index) => { //这里就可以把要展开的key加进来记住必须是唯一的
keyArr.push(item.key)
})
this.setState({
expandedRowKeys: keyArr
})
}
onExpand = (expanded, record) => { //expanded是否展开 record每一项的值
let { expandedRowKeys } = this.state;
if (expanded) {
let arr = expandedRowKeys;
arr.push(record.key);
this.setState({
expandedRowKeys: arr
})
} else {
let arr2 = [];
if (expandedRowKeys.length > 0 && record.key) {
arr2 = expandedRowKeys.filter((key) => {
return key !== record.key;
})
}
this.setState({
expandedRowKeys: arr2
})
}
}
render() {
return (
{ //expanded-是否可展开, onExpand-展开事件默认, record-每一项的值 设置自定义图标
if (record.children&&record.children.length != 0) {//有子项加才有图标（根据自己的额业务需求变动）
if (expanded) {//根据是否可以展开判断
return onExpand(record, e)} />
} else {
return onExpand(record, e)} />
}
} else {
return ''
}
}}
expandedRowKeys={this.state.expandedRowKeys}
onExpand={this.onExpand}
/>
);
}
}
3.给不同层级加颜色（类似于隔行变色）
实现思路：根据level来判断层级利用rowClassName来动态该改变类名
class index extends Component {
state = {
expandedRowKeys: []
}
componentDidMount() {
let keyArr = [];
data.map((item, index) => { //这里就可以把要展开的key加进来记住必须是唯一的
keyArr.push(item.key)
})
this.setState({
expandedRowKeys: keyArr
})
}
onExpand = (expanded, record) => { //expanded是否展开 record每一项的值
let { expandedRowKeys } = this.state;
if (expanded) {
let arr = expandedRowKeys;
arr.push(record.key);
this.setState({
expandedRowKeys: arr
})
} else {
let arr2 = [];
if (expandedRowKeys.length > 0 && record.key) {
arr2 = expandedRowKeys.filter((key) => {
return key !== record.key;
})
}
this.setState({
expandedRowKeys: arr2
})
}
}
classNameFn=(record, index)=>{
let className="";
if(record){
if(record.leve==1){
className="leve1"
}else if(record.leve==2){
className="leve2"
}else if(record.leve==3){
className="leve3"
}else{
className=""
}
}
console.log(className)
return className;
}
render() {
return (
{ //expanded-是否可展开, onExpand-展开事件默认, record-每一项的值 设置自定义图标
if (record.children&&record.children.length != 0) {
if (expanded) {//根据是否可以展开判断
return onExpand(record, e)} />
} else {
return onExpand(record, e)} />
}
} else {
return ''
}
}}
expandedRowKeys={this.state.expandedRowKeys} //展开行
onExpand={this.onExpand} //展开事件
rowClassName={this.classNameFn} //表格行类名
/>
);
}
}
@import '~antd/es/style/themes/default.less';
.leve1{
background: burlywood;
}
.leve2{
background: blue;
}
.leve3{
background: gray;
}4.给表格设置样式
给表格设置样式需要元素审查一级一级的找
利用：'：global'来覆盖就行
总结：
antd是很好的开源UI库，但也存在很多问题。需要根据自己的业务来，选择适合的组件。另外antd-pro是一个不错的框架（dva+umi），可以快速开发应用。
本文参考资料来自：antd API官方文档 antd-pro API 文档
你可能感兴趣的:(React,react-antd)
TypeScript 学习笔记（七）：TypeScript 与后端框架的结合应用
Evaporator Core
typescript 前端框架 学习
1.引言在前几篇学习笔记中，我们已经探讨了TypeScript的基础知识和在前端框架（如Angular和React）中的应用。本篇将重点介绍TypeScript在后端开发中的应用，特别是如何与Node.js和Express结合使用，以构建强类型、可维护的后端应用。2.TypeScript与Node.jsNode.js是一个基于ChromeV8引擎的JavaScript运行时，广泛用于构建后端应用。
掌握 React 高阶组件与高阶函数：构建可复用组件的新境界
风茫
React react.js javascript
一、引言在React开发中，代码复用性和逻辑分离是提高开发效率和维护性的重要手段。高阶组件（Higher-OrderComponent,HOC）和高阶函数（Higher-OrderFunction,HOF）是实现这一目标的两种强大工具。本文将详细介绍这两种技术的概念、应用场景及其实现方式，并通过具体示例帮助你更好地理解和应用它们。二、高阶函数（HOF）1.概念高阶函数是指以函数作为参数或返回值的函
ReactiveSwift 简单使用
Johnny Tong
iOS 之旅 swift
记录ReactiveSwift简单使用导入ReactiveSwift库创建TestViewModel文件enumJKTypeType:Int{casecloudcasedevicecaseweater}//通过监听属性变化classTestViewModel:NSObject{lazyvarrecordType:Property={returnProperty(recordTypeProperty
停止在 React 组件回调中使用箭头函数！
@大迁世界
react.js javascript 前端 ecmascript 前端框架
在构建React应用时,许多开发者都喜欢使用箭头函数,因为它们简洁易用。但你知道吗,在组件回调中直接使用箭头函数可能会导致一些性能问题？在本文中,我们将分析这种情况发生的原因,并探讨你应该考虑的最佳实践。什么是箭头函数？在深入讨论最佳实践之前,我们快速回顾一下箭头函数。箭头函数是ES6引入的特性,它为JavaScript中的函数书写提供了更简短的语法。相比使用更冗长的function关键字,你可以
react-quill报错Listener added for a ‘DOMNodeInserted‘ mutation event.Support for this event type has..
lryh_
插件 react.js 前端
1、删除node_modules和package-lock.json2、重装依赖npmi3、找到node_modules中quill==》dist==》quill.js文件中修改代码//_this.domNode.addEventListener('DOMNodeInserted',function(){});newMutationObserver(()=>{}).observe(_this.do
React和Vue中暴露子组件的属性和方法给父组件用，并且控制子组件暴露的颗粒度的做法
向画
React react.js vue.js javascript
React在React中，forwardRef是一种高级技术，它允许你将ref从父组件传递到子组件，从而直接访问子组件的DOM节点或公开的方法。这对于需要操作子组件内部状态或DOM的场景非常有用。为了使子组件能够暴露其属性和方法给父组件，通常会结合useImperativeHandleHook使用forwardRef。如何使用forwardRef和useImperativeHandle创建一个带有
前端-跨端跨平台框架介绍
有哥来袭
跨端跨平台 前端
1.Taro官网:https://taro-docs.jd.com/docsTaro是一个开放式跨端跨框架解决方案，支持使用React/Vue/Nerv等框架来开发微信/京东/百度/支付宝/字节跳动/QQ/飞书小程序/H5/RN等应用。2.ReactNative中文文档:https://reactnative.cn/英文文档:https://reactnative.dev/docs/getting
你可能不知道的antd倒计时组件用法
前端reactantd
前言ps:本文使用ant组件库和react技术栈，因此假定你导入了这些依赖包。如果让你实现一个显示当前日期的定时器组件，你会怎么做？如下图所示:初步实现探索碰到这样的需求，你是不是会使用定时器来实现，如下所示:importReact,{useEffect,useState}from'react';import{Statistic}from'antd';importdayjsfrom'dayjs';
Three.js实现动态水泡效果逐步解析GLSL着色器
贵州数擎科技有限公司
javascript 着色器 开发语言
大家好！我是[数擎AI]，一位热爱探索新技术的前端开发者，在这里分享前端和Web3D、AI技术的干货与实战经验。如果你对技术有热情，欢迎关注我的文章，我们一起成长、进步！开发领域：前端开发|AI应用|Web3D|元宇宙技术栈：JavaScript、React、ThreeJs、WebGL、Go经验经验：6年+前端开发经验，专注于图形渲染和AI技术经验经验：演示地址开源项目：智简未来、晓智元宇宙、数字
基于 React 和 Vite 的前端项目自动化测试方案
背景前端自动化测试在工程化的研发体系中不可或缺。前端领域的自动化测试常被忽略，原因在于人们认为编写测试用例成本高且意义不大，本质是觉得投资回报率低。但当收益大于支出时，引入前端自动化测试是必要的。例如在表单功能从简单到复杂的迭代过程中，手动测试成本会指数级增长且可能无法完成所有测试，此时引入自动化测试能提升效率、保证测试覆盖范围、减少误差和遗漏、实现用例重复使用等。成本初始成本，引入自动化测试框架
Next.js 15 重大更新解析
作为React框架的佼佼者，Next.js的第15个版本带来了诸多激动人心的更新。这次更新重点优化了开发工作流程、性能表现，并加强了安全性。现在就来深入了解这些新特性。自动化升级工具Next.js15引入了全新的codemodCLI工具，大大简化了版本升级流程。只需要运行以下命令即可升级到最新版本：npx@next/codemod@canaryupgraderc该工具不仅能自动更新依赖，还会展示可
Vue 开发者的 React 实战指南：表单处理篇
作为Vue开发者，在迁移到React开发时，表单处理的差异是一个重要的适应点。本文将从Vue开发者熟悉的角度出发，详细介绍React中的表单处理方式和最佳实践。基础表单处理对比Vue的表单处理在Vue中，我们习惯使用v-model进行双向绑定：用户名：密码：记住我：登录exportdefault{data(){return{form:{username:'',password:'',remembe
Node.js、Vue 和 React 的关系和区别
佐木宥轩
node.js
Node.js、Vue和React是前端和后端开发中常用的技术，它们各自有不同的作用，但可以协同工作来构建现代化的Web应用。为了通俗易懂地理解它们的关系，我们可以用一个餐厅的比喻来说明。1.Node.js：厨房的后台Node.js是一个基于JavaScript的运行时环境，主要用于构建服务器端应用程序。它就像餐厅的厨房，负责处理数据和逻辑。作用：提供后端服务，比如处理数据库、用户认证、文件上传等
Vue 开发者的 React 实战指南：路由和导航篇
作为Vue开发者，在迁移到React开发时，路由系统的差异是需要重点关注的部分。本文将从VueRouter的使用经验出发，详细介绍ReactRouter的使用方式和最佳实践。基础路由配置VueRouter配置在Vue中，我们通常这样配置路由：//router/index.jsimport{createRouter,createWebHistory}from'vue-router';importHo
系统设计架构——互联网案例
大猩猩爱分享
java 架构
Netflix的技术栈移动和网络：Netflix采用Swift和Kotlin来构建原生移动应用。对于其Web应用程序，它使用React。前端/服务器通信：Netflix使用GraphQL。后端服务：Netflix依赖ZUUL、Eureka、SpringBoot框架和其他技术。数据库：Netflix使用EV缓存、Cassandra、CockroachDB和其他数据库。消息传递/流媒体：Netflix
【学术会议论文投稿】前端框架巅峰对决：React、Vue与Angular的全面解析与实战指南
小周不想卷
艾思科蓝学术会议投稿 前端框架
【JPCS独立出版】第三届能源与动力工程国际学术会议（EPE2024）_艾思科蓝_学术一站式服务平台更多学术会议请看：https://ais.cn/u/nuyAF3引言在快速发展的前端技术领域，选择合适的框架或库对于项目的成功至关重要。React、Vue和Angular作为当前最流行的三大前端框架/库，各自拥有独特的优势和适用场景。本文将通过深入的文字解析和代码讲解，帮助开发者理解这三者的差异，并
探讨 React 中的状态管理：选择合适的工具
随着React的流行，开发者在构建复杂应用时常常面临的一个重要问题是如何有效地管理组件的状态。状态管理不仅涉及到在应用内传递数据，还包括如何在不同的组件间同步状态、优化性能，以及保持代码的可维护性。在这一领域，有许多工具和方法可供选择，本文将深入探讨React状态管理的几个关键概念，并比较几种常见的状态管理工具。状态管理的基本概念在React中，状态是一个组件生命周期中可能随时间改变的数据。Rea
小白：react antd 搭建框架关于 RangePicker DatePicker 时间组件使用记录 2
LZQ <=小氣鬼=>
react + antd
文章目录一、关于RangePicker组件返回的moment方法示例一、关于RangePicker组件返回的moment方法示例moment方法中日后开发有用的方法如下：form.getFieldsValue().date[0].weeksInWeekYear(),form.getFieldsValue().date[0].zoneName(),form.getFieldsValue().date
react Hooks 父组件调用子组件函数、获取子组件属性
初遇你时动了情
react.js javascript 前端
子组件import{forwardRef,useImperativeHandle}from'react'//定义子组件的ref类型exportinterfaceChildRef{childMethod:()=>voidchildValue:string}constChild=forwardRef((props,ref)=>{//暴露给父组件的方法和属性useImperativeHandle(ref
深度解析 React 中 setState 的原理：同步还是异步
在React框架的核心机制里，setState是实现动态交互与数据驱动视图更新的关键枢纽。深入理解setState的工作原理，尤其是其同步与异步的特性，对于编写高效、稳定且可预测的React应用至关重要。一、setState的基础认知在React组件中，状态（state）是驱动组件行为与渲染结果的核心数据。setState作为更新状态的唯一官方途径，负责触发组件的重新渲染，从而反映出状态的变化。以
从零开始学 MobX Store：简化 React 数据管理
javascriptreact
学习如何使用MobXStore在React应用中实现全局状态管理。本文通过简单的购物车功能示例，帮助你理解MobXStore的基本概念、使用方法以及如何高效共享和管理数据，解决多组件间的数据同步问题。适合所有想提升React开发效率的开发者。文章目录什么是MobXStore？先理解问题MobXStore提供哪些功能？MobX的两种写法1.装饰器写法（旧版本常见）2.makeObservable写法
掌握 React Router：构建你的 React 应用导航
大家好，我是长林啊！一个Go、Rust爱好者，同时也是一名全栈开发者；致力于终生学习和技术分享。本文首发于微信公众号《全栈修炼之旅》，欢迎大家关注！在构建现代Web应用时，导航是连接用户界面的关键纽带。ReactRouter作为React生态中的核心路由库，为开发者提供了强大的工具来实现SPA（单页应用）的导航逻辑。它不仅简化了页面间的跳转，还支持动态路由匹配、懒加载和状态管理集成，让应用的导航更
回顾技术圈的2024尤雨溪喷React的“开年之战”
前端vue.jsreact
在2024年初，前端开发社区的一场激烈讨论围绕着React新版文档展开。这场讨论的导火索来自于Vue.js的创始人尤雨溪，他在Twitter上发表了对React新版文档的批评，认为React将复杂性转嫁给用户，未能有效地减轻使用该框架的心智负担。尤雨溪的言论迅速在React和Vue社区间引发了广泛的讨论，许多开发者开始针对React文档的设计哲学展开辩论，这一事件引起了前端开发者对框架设计理念和用
Vue 开发者的 React 实战指南：部署与持续集成篇
作为Vue开发者，在迁移到React开发时，除了开发过程中的差异，部署和持续集成的策略也需要相应调整。本文将详细介绍React项目的部署流程和持续集成最佳实践。构建流程对比Vue的构建流程在Vue项目中，我们通常使用：VueCLI或Vite构建工具npmrunbuild生成生产环境代码输出目录通常是dist#VueCLInpmrunbuild#输出到dist目录#Vitenpmrunbuild#输
Vue 开发者的 React 实战指南：测试篇
作为Vue开发者，在迁移到React开发时，测试策略和方法也需要相应调整。本文将从Vue开发者熟悉的角度出发，详细介绍React中的测试方法和最佳实践。测试工具对比Vue的测试工具在Vue生态中，我们通常使用：VueTestUtils：官方的组件测试工具Jest：单元测试框架Cypress：端到端测试工具//Vue组件测试示例import{mount}from'@vue/test-utils';i
Vue 开发者的 React 实战指南：性能优化篇
作为Vue开发者，在迁移到React开发时，性能优化的思路和方法会有所不同。本文将从Vue开发者熟悉的角度出发，详细介绍React中的性能优化策略。渲染优化对比Vue的响应式系统Vue通过响应式系统自动追踪依赖，只有在数据真正变化时才会触发重渲染{{title}}{{description}}点击次数：{{count}}+1exportdefault{data(){return{title:'标题
前端-从入门到入土
前端学习路线基础部分（HTML+CSS+JS入门）快速了解，能够进行简单的页面布局，交互JS部分，可以写一些小demo来熟悉常见的API推荐教程：https://www.bilibili.com/video/BV1BT4y1W7Aw/?spm_id_from=333....框架部分这里推荐Vue框架，相对React会更容易上手，并且中文文档也相对友好推荐教程：https://www.bilibil
H5跳转到 React Native App
H5在浏览器跳转到App配置URLSchemesIOSInfo.plistCFBundleURLTypesCFBundleTypeRoleEditorCFBundleURLSchemesxxxxAndroidAndroidManifest.xmlh5跳转通过window.location.href=xxxxx的方式跳转constopenApp=(isIOS,extinfo?:string)=>{i
node.js学习
小猿L
node.js node.js 学习 vim
node.js学习实操及笔记温故node.js，node.js学习实操过程及笔记~node.js学习视频node.js官网node.js中文网实操笔记githubcsdn笔记为什么学node.js可以让别人访问我们编写的网页为后续的框架学习打下基础，三大框架vuereactangular离不开node.jsnode.js是什么官网：node.js是一个开源的、跨平台的运行JavaScript的运行
react-intl——react国际化使用方案
苹果酱0567
面试题汇总与解析 java 开发语言 中间件 spring boot 后端
国际化介绍i18n：internationalization国家化简称，首字母+首尾字母间隔的字母个数+尾字母，类似的还有k8s(Kubernetes)React-intl是React中最受欢迎的库。使用步骤安装#usenpmnpminstallreact-intl-D#useyarn项目入口文件配置//index.tsximportReactfrom"react";importReactDOMf
mondb入手
木zi_鸣
mongodb
windows 启动mongodb 编写bat文件，
mongod --dbpath D:\software\MongoDBDATA
mongod --help 查询各种配置
配置在mongob
打开批处理，即可启动，27017原生端口，shell操作监控端口 扩展28017，web端操作端口
启动配置文件配置，
数据更灵活
大型高并发高负载网站的系统架构
bijian1013
高并发 负载均衡
扩展Web应用程序
一.概念
简单的来说，如果一个系统可扩展，那么你可以通过扩展来提供系统的性能。这代表着系统能够容纳更高的负载、更大的数据集，并且系统是可维护的。扩展和语言、某项具体的技术都是无关的。扩展可以分为两种：
1.
DISPLAY变量和xhost(原创)
czmmiao
display
DISPLAY
在Linux/Unix类操作系统上, DISPLAY用来设置将图形显示到何处. 直接登陆图形界面或者登陆命令行界面后使用startx启动图形, DISPLAY环境变量将自动设置为:0:0, 此时可以打开终端, 输出图形程序的名称(比如xclock)来启动程序, 图形将显示在本地窗口上, 在终端上输入printenv查看当前环境变量, 输出结果中有如下内容:DISPLAY=:0.0
获取B/S客户端IP
周凡杨
java 编程 jsp Web 浏览器
最近想写个B/S架构的聊天系统，因为以前做过C/S架构的QQ聊天系统，所以对于Socket通信编程只是一个巩固。对于C/S架构的聊天系统，由于存在客户端Java应用，所以直接在代码中获取客户端的IP，应用的方法为：
String ip = InetAddress.getLocalHost().getHostAddress();
然而对于WEB
浅谈类和对象
朱辉辉33
编程
类是对一类事物的总称，对象是描述一个物体的特征，类是对象的抽象。简单来说，类是抽象的，不占用内存，对象是具体的，
占用存储空间。
类是由属性和方法构成的，基本格式是public class 类名{
//定义属性
private/public 数据类型 属性名；
//定义方法
publ
android activity与viewpager+fragment的生命周期问题
肆无忌惮_
viewpager
有一个Activity里面是ViewPager，ViewPager里面放了两个Fragment。
第一次进入这个Activity。开启了服务，并在onResume方法中绑定服务后，对Service进行了一定的初始化，其中调用了Fragment中的一个属性。
super.onResume();
bindService(intent, conn, BIND_AUTO_CREATE);
base64Encode对图片进行编码
843977358
base64 图片 encoder
/**
* 对图片进行base64encoder编码
*
* @author mrZhang
* @param path
* @return
*/
public static String encodeImage(String path) {
BASE64Encoder encoder = null;
byte[] b = null;
I
Request Header简介
aigo
servlet
当一个客户端(通常是浏览器)向Web服务器发送一个请求是，它要发送一个请求的命令行，一般是GET或POST命令，当发送POST命令时，它还必须向服务器发送一个叫“Content-Length”的请求头(Request Header) 用以指明请求数据的长度，除了Content-Length之外，它还可以向服务器发送其它一些Headers，如：
HttpClient4.3 创建SSL协议的HttpClient对象
alleni123
httpclient 爬虫 ssl
public class HttpClientUtils
{
public static CloseableHttpClient createSSLClientDefault(CookieStore cookies){
SSLContext sslContext=null;
try
{
sslContext=new SSLContextBuilder().l
java取反 -右移-左移-无符号右移的探讨
百合不是茶
位运算符 位移
取反：
在二进制中第一位，1表示符数，0表示正数
byte a = -1;
原码：10000001
反码：11111110
补码：11111111
//异或: 00000000
byte b = -2;
原码：10000010
反码：11111101
补码：11111110
//异或: 00000001
java多线程join的作用与用法
bijian1013
java 多线程
对于JAVA的join，JDK 是这样说的：join public final void join （long millis ）throws InterruptedException Waits at most millis milliseconds for this thread to die. A timeout of 0 means t
Java发送http请求(get 与post方法请求)
bijian1013
java spring
PostRequest.java
package com.bijian.study;
import java.io.BufferedReader;
import java.io.DataOutputStream;
import java.io.IOException;
import java.io.InputStreamReader;
import java.net.HttpURL
【Struts2二】struts.xml中package下的action配置项默认值
bit1129
struts.xml
在第一部份，定义了struts.xml文件，如下所示：
<!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.3//EN"
"http://struts.apache.org/dtds/struts
【Kafka十三】Kafka Simple Consumer
bit1129
simple
代码中关于Host和Port是割裂开的，这会导致单机环境下的伪分布式Kafka集群环境下，这个例子没法运行。
实际情况是需要将host和port绑定到一起，
package kafka.examples.lowlevel;
import kafka.api.FetchRequest;
import kafka.api.FetchRequestBuilder;
impo
nodejs学习api
ronin47
nodejs api
NodeJS基础 什么是NodeJS
JS是脚本语言，脚本语言都需要一个解析器才能运行。对于写在HTML页面里的JS，浏览器充当了解析器的角色。而对于需要独立运行的JS，NodeJS就是一个解析器。
每一种解析器都是一个运行环境，不但允许JS定义各种数据结构，进行各种计算，还允许JS使用运行环境提供的内置对象和方法做一些事情。例如运行在浏览器中的JS的用途是操作DOM，浏览器就提供了docum
java-64.寻找第N个丑数
bylijinnan
java
public class UglyNumber {
/**
* 64.查找第N个丑数
具体思路可参考 [url] http://zhedahht.blog.163.com/blog/static/2541117420094245366965/[/url]
*
题目：我们把只包含因子
2、3和5的数称作丑数（Ugly Number）。例如6、8都是丑数，但14
二维数组（矩阵）对角线输出
bylijinnan
二维数组
/**
二维数组 对角线输出 两个方向
例如对于数组：
{ 1, 2, 3, 4 },
{ 5, 6, 7, 8 },
{ 9, 10, 11, 12 },
{ 13, 14, 15, 16 },
slash方向输出：
1
5 2
9 6 3
13 10 7 4
14 11 8
15 12
16
backslash输出：
4
3
[JWFD开源工作流设计]工作流跳跃模式开发关键点(今日更新)
comsci
工作流
既然是做开源软件的,我们的宗旨就是给大家分享设计和代码,那么现在我就用很简单扼要的语言来透露这个跳跃模式的设计原理
大家如果用过JWFD的ARC-自动运行控制器,或者看过代码,应该知道在ARC算法模块中有一个函数叫做SAN(),这个函数就是ARC的核心控制器,要实现跳跃模式,在SAN函数中一定要对LN链表数据结构进行操作,首先写一段代码,把
redis常见使用
cuityang
redis 常见使用
redis 通常被认为是一个数据结构服务器，主要是因为其有着丰富的数据结构 strings、map、 list、sets、 sorted sets
引入jar包 jedis-2.1.0.jar (本文下方提供下载)
package redistest;
import redis.clients.jedis.Jedis;
public class Listtest
配置多个redis
dalan_123
redis
配置多个redis客户端
<?xml version="1.0" encoding="UTF-8"?><beans xmlns="http://www.springframework.org/schema/beans" xmlns:xsi=&quo
attrib命令
dcj3sjt126com
attr
attrib指令用于修改文件的属性.文件的常见属性有:只读.存档.隐藏和系统.
只读属性是指文件只可以做读的操作.不能对文件进行写的操作.就是文件的写保护.
存档属性是用来标记文件改动的.即在上一次备份后文件有所改动.一些备份软件在备份的时候会只去备份带有存档属性的文件.
Yii使用公共函数
dcj3sjt126com
yii
在网站项目中，没必要把公用的函数写成一个工具类，有时候面向过程其实更方便。 在入口文件index.php里添加 require_once('protected/function.php'); 即可对其引用，成为公用的函数集合。 function.php如下：
<?php /** * This is the shortcut to D
linux 系统资源的查看（free、uname、uptime、netstat）
eksliang
netstat linux uname linux uptime linux free
linux 系统资源的查看
转载请出自出处：http://eksliang.iteye.com/blog/2167081
http://eksliang.iteye.com 一、free查看内存的使用情况
语法如下：
free [-b][-k][-m][-g] [-t]
参数含义
-b:直接输入free时，显示的单位是kb我们可以使用b(bytes),m
JAVA的位操作符
greemranqq
位运算 JAVA位移 << >>>
最近几种进制，加上各种位操作符，发现都比较模糊，不能完全掌握，这里就再熟悉熟悉。
1.按位操作符 ：
按位操作符是用来操作基本数据类型中的单个bit,即二进制位，会对两个参数执行布尔代数运算，获得结果。
与（&）运算：
1&1 = 1, 1&0 = 0, 0&0 &
Web前段学习网站
ihuning
Web
Web前段学习网站
菜鸟学习：http://www.w3cschool.cc/
JQuery中文网：http://www.jquerycn.cn/
内存溢出：http://outofmemory.cn/#csdn.blog
http://www.icoolxue.com/
http://www.jikexue
强强联合：FluxBB 作者加盟 Flarum
justjavac
r
原文：FluxBB Joins Forces With Flarum作者：Toby Zerner译文：强强联合：FluxBB 作者加盟 Flarum译者：justjavac
FluxBB 是一个快速、轻量级论坛软件，它的开发者是一名德国的 PHP 天才 Franz Liedke。FluxBB 的下一个版本(2.0)将被完全重写，并已经开发了一段时间。FluxBB 看起来非常有前途的，
java统计在线人数（session存储信息的）
macroli
java Web
这篇日志是我写的第三次了 前两次都发布失败！郁闷极了！
由于在web开发中常常用到这一部分所以在此记录一下，呵呵，就到备忘录了！
我对于登录信息时使用session存储的，所以我这里是通过实现HttpSessionAttributeListener这个接口完成的。
1、实现接口类，在web.xml文件中配置监听类，从而可以使该类完成其工作。
public class Ses
bootstrp carousel初体验 快速构建图片播放
qiaolevip
每天进步一点点 学习永无止境 bootstrap 纵观千象
img{
border: 1px solid white;
box-shadow: 2px 2px 12px #333;
_width: expression(this.width > 600 ? "600px" : this.width + "px");
_height: expression(this.width &
SparkSQL读取HBase数据，通过自定义外部数据源
superlxw1234
spark sparksql sparksql读取hbase sparksql外部数据源
关键字：SparkSQL读取HBase、SparkSQL自定义外部数据源
前面文章介绍了SparSQL通过Hive操作HBase表。
SparkSQL从1.2开始支持自定义外部数据源(External DataSource)，这样就可以通过API接口来实现自己的外部数据源。这里基于Spark1.4.0，简单介绍SparkSQL自定义外部数据源，访
Spring Boot 1.3.0.M1发布
wiselyman
spring boot
Spring Boot 1.3.0.M1于6.12日发布，现在可以从Spring milestone repository下载。这个版本是基于Spring Framework 4.2.0.RC1,并在Spring Boot 1.2之上提供了大量的新特性improvements and new features。主要包含以下：
1.提供一个新的sprin
