视频学习地址:

官方地址

神坑:

1、每次this.setState都会重新初始化getInitialState中的参数

2、createClass的命名必须以大写开头如,var MySelect = React.createClass,这里如果定义为myselect就会出错

3、render方法的第一个参数return,html代码的第一行必须和return同一行,剩下的才可以换行,也就是不能让 return 孤零零的占据一行,或者用括号将html代码括起来

4、如果你是Linux或者mac系统,在执行工具如babel/webpack时记得加上权限(sudo)

5、.babelrc文件中的缩进非常有讲究,必须是两个空格。不讲究也没关系。反正是用webpack来代替.babelrc文件的配置的

6、Html的for属性必须改为htmlFor,class属性必须改为className

7、引入组件必须使用如下形式: import { Mysearch } from './header.js'

8、和vue很相似。render函数中return的(jsx)Html,最外层必须包含一个div。也就是说不能同时return两个同级的div

html环境搭建(前期学习使用,后期废弃)

<!DOCTYPE html>
<html>
<meta charset='utf-8'>
<head>
    <title></title>
    <script src="http://cdn.bootcss.com/react/15.0.0/react.min.js"></script>
    <script src="http://cdn.bootcss.com/react/15.0.0/react-dom.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.34/browser.min.js"></script>
</head>
<body>

</body>
</html>

demo 1 渲染

    <script type="text/babel">
      ReactDOM.render(
        <h1>Hello, world!</h1>,
        document.getElementById('example')
      );
    </script>

demo 2 循环

<script type="text/babel">
var nav_li=[
<li><a href='#'>最新电影</a></li>,
<li><a href='#'>最新评论</a></li>
    ];
ReactDOM.render(
         <ul>{nav_li}</ul>,
         document.getElementById('navbar')
)
</script>

<script type="text/babel">
var nav_li=['最新电影', '最新评论'];
ReactDOM.render(
         <ul>
         {
             nav_li.map(function(item){
                 return <li><a href='#'>{item}</a></li>;
             })
         }
         </ul>,
         document.getElementById('navbar')
)
</script>

 demo3 : 绑定事件

<script type="text/babel">
var aa = function()
{
alert("123");
}

var nav_li=['最新电影', '最新评论'];
ReactDOM.render(
         <ul>
         {
             nav_li.map(function(item){
                 return <li><a href='#' onClick={function(){alert('123')}}>{item}</a></li>;
          return <li><a href='#' onClick={aa}>{item}</a></li>;
             })
         }
         </ul>,
         document.getElementById('navbar')
)
</script>

demo4 : 组件化(重头戏)

var NavLI = React.createClass({
    myFunc : function(){alert(")},
    render : function()
    {
        return  <ul>
                    <li><a href='#' onClick={this.myFunc}>最新电影</a></li>
                    <li><a href='#'>最新评论</a></li>
                </ul>
    }
})

ReactDOM.render(
         <NavLI />,
         document.getElementById('navbar')
)    

demo5:嵌套组件、递归属性(this.props.XXX),注意!! HTML的class在这里是className

var NavBar = React.createClass({
    myFunc : function(){alert("123")},
    render : function()
    {
        return  <ul>
                    <li><a href='#' onClick={this.myFunc}>最新电影</a></li>
                    <li><a href='#'>最新评论</a></li>
                    <li><SearchText SearchText_abc={this.props.SearchText_abc} /></li>
                </ul>
    }
})

var SearchText = React.createClass({
    render:function()
    {
        return <input type="text" placeholder = "请输入文字" className = {this.props.SearchText_abc} />
    }
})

ReactDOM.render(
         <NavBar SearchText_abc="Lee" />,
         document.getElementById('navbar')
)    

demo6: AJAX实战,在success后必须重新绑定this指针

#js代码
var MoviesList = React.createClass
({
    getInitialState:function()
    {
        return {
            movie:[]
        }
    },
    componentDidMount:function()
    {
        $.ajax
        ({
            url:"http://zhaohong.com",
            success:function(data)
            {
                data = JSON.parse(data);
                console.log(data);
                this.setState({movie:data});
            }.bind(this)  //将AJAX中的this的指针更换为当前对象
        })
    },
    render:function()
    {
        //console.log("我是reander",this.state.movie);
        var myli = this.state.movie.map(function(item)
        {
            console.log(item);
            return <li>{item.moiveName}</li>
        });
        return <ul>{myli}</ul>
    }
})

ReactDOM.render(
        <ul>
            <MoviesList />
        </ul>,
        document.getElementById('moiveList')
)

#php代码
header("Access-Control-Allow-Origin:*");
        $arr = array();
        $arr[0]["moiveName"] = "美国队长3内战";
        $arr[1]["moiveName"] = "X战警3天启";
        $arr[2]["moiveName"] = "大鱼海棠";

        $arr[0]["id"] = "1";
        $arr[1]["id"] = "2";
        $arr[2]["id"] = "3";

        $arr[0]["info"] = "奥创纪元之后,全球政府联合颁布法令,管控超能力活动。对这条法令的不同态度,使复仇者阵营一分为二,钢铁侠和美国队长各据一方,其他复仇者则不得不做出自己的选择,最终引发前任盟友间的史诗大战。";
        $arr[1]["info"] = "该片故事以20世纪80年代为背景,讲述了古老强大的第一个变种人天启在埃及醒来,他想统治并改变这个世界,而引发一系列变种人大战的故事";
        $arr[2]["info"] = "所有人类的灵魂都是海里一条巨大的鱼,出生的时候从海的此岸出发,在路途中,有时相遇,有时分开,死的时候去到海的彼岸,之后变成一条沉睡的小鱼,等待多年后的再次出发,这个旅程永远不会结束,生命往复不息。十六岁生日那天,居住在“神之围楼”里的一个名叫椿的女孩变作一条海豚到人间巡礼,被大海中的一张网困住,一个人类男孩因为救她而落入深海死去。为了报恩,为了让人类男孩复活,她需要在自己的世界里,历经种种困难与阻碍,帮助死后男孩的灵魂——一条拇指那么大的小鱼,成长为一条比鲸更巨大的鱼并回归大海";
        exit(json_encode($arr));
 

demo7 : 移除组件、移除时的事件

var NavBar = React.createClass({
    myFunc : function(){alert(")},
    myRemove:function(){ReactDOM.unmountComponentAtNode(document.getElementById('navbar'))},
    render : function()
    {
        return  <ul>
                    <li><a href='#' onClick={this.myFunc}>最新电影</a></li>
                    <li><a href='#' onClick={this.myRemove}>最新评论</a></li>
                    <li><SearchText SearchText_abc={this.props.SearchText_abc} /></li>
                </ul>
    },
    componentWillUnmount: function() {
        alert("我被移除了");
    }
})

demo8 : Input设置value属性时的问题、由于value是React的保留字段,当对Input书写该属性的时候,会造成input只读。需要配合state + onChange + e.target.value来实现正常input

var SearchText = React.createClass
({
    getInitialState:function()
    {
        return {
            title:"请输入文字"
        }
    },
    myChange:function(e)
    {
        var v = e.target.value;
        this.setState({title:v});
    },
    render:function()
    {
        return <input type="text" placeholder = "请输入文字" value={this.state.title} onChange={this.myChange} className = {this.props.SearchText_abc} />
    }
})

Demo9:引入组件,注意label的for属性必须改为htmlFor

#index.js
var React = require("react")
var ReactDOM = require("react-dom")
import { Mysearch } from './header.js'

ReactDOM.render(
    <Mysearch />,
    document.getElementById('Header')
)     

#header.js
var React = require("react")var Mysearch = React.createClass({
    render : function()
    {
        return (
                <div className="comm_list_temp">
                        <div className="comm_input">
                            <ul>
                                <li className="oneline"><label htmlFor="min_sales">模板名称:</label>
                                    <input type="text" value="" name="" className="nomore" />
                                    <button type="button" className="redbutton fl ml-10">搜索</button>
                                    <button type="reset" className="whitebutton fl ml-10">重置</button>
                                </li>
                            </ul>
                        </div>
                 </div>
        )
    }
})

exports.Mysearch = Mysearch;

正片开始,前方高能

安装babel以及各种插件(es2015/react/react-dom/react解析)

(神坑:文件夹如果也叫react,那么你在npm init时的项目命名千万别和react重名(默认会是你的文件夹名),当然包括其他组件名和框架名都要避免。否则会报错)

安装nodejs http://nodejs.cn/

安装 babel npm install babel-cli -g

安装webpack npm install webpack -g

安装插件
npm install
             babel-core
             babel-preset-react
             babel-preset-es2015
             babel-preset-stage-0
             react
             react-dom
             webpack
             babel-loader
             css-loader
             style-loader
             webpack-dev-server
             html-webpack-plugin
             url-loader
 --save-dev
webpack.config.js
var HtmlWebpackPlugin = require('html-webpack-plugin');
var webpack = require('webpack');
var path = require("path");

module.exports = {
    entry:{
       app : ['./src/js/index.js']
    },
    output: {
         path: path.resolve(__dirname, "build/js"),
         filename:'[name].js'   //最终打包生成的文件名
    },
    devServer: {
        historyApiFallback: true,
        hot: true,
        inline: true,
        progress: true,
        port:9091    //这个端口你可以自定义
    },
    module: {
        loaders: [
            {
                test: /\.js|jsx$/,   //是一个正则,代表js或者jsx后缀的文件要使用
                loader: 'babel',
                query:{
                    presets:['es2015','react','stage-0'] //必须先安装babel-preset-es2015和babel-preset-react
                }
            },
            {
                test: /\.css$/,
                loaders: ['style', 'css'],  //必须先安装css-loader和style-loader
      },
            {
                test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
                loader: 'url',
                query: {
                  limit: 10000,
                  name: './build/img/[name].[hash:7].[ext]'
                }
            },
            {
                test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
                loader: 'url',
                query: {
                  limit: 10000,
                  name: './build/fonts/[name].[hash:7].[ext]'
                }
            }    
     ]
  },
    plugins:[
        //动态将上面编译好的js文件导入到以下html文件中并且生成到指定目录
        new HtmlWebpackPlugin({
             template:__dirname + '/src/tpl/index.html',
             filename:__dirname + '/build/tpl/index.html',
             hash:true,
             inject:"body",
             chunks:['common','app']
        }),     //提取出公共的代码
        new webpack.optimize.CommonsChunkPlugin({
            name:"common",  //对应entry的对象名称
            chunks:['app']
        })
    ]  
}

使用webpack:
sudo webpack

热编译

每次修改完代码都要手动在控制台中输入webpack是很变态的一件事,最好能每次保存js文件时自动编译。这就是热编译

但是,热编译是热编译、build是build(这里的build指的是在控制台单独使用webpack编译)、一定要区分开来各自的作用。

打开package.json加入

"scripts": {  "start": "webpack-dev-server --hot --inline"
}

在根目录中新建test/index1.html (请务必注意以下代码的script引用规则)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
     <div id="app"></div>

    <!-- #这个是必须加载的文件 -->
    <script src="http://localhost:9091/webpack-dev-server.js"></script> 

    <!-- #这下面就是需要热编译的js,必须是webpack中输出的文件才有效 -->
    <script src="http://localhost:9091/common.js"></script>
    <script src="http://localhost:9091/app.js"></script>

</body>
</html> 

打开控制台

#开启热编译npm start  

打开网页 : localhost:9091/test/index1.html

当修改该页面引入的js文件时。就会自动编译

注意,这个热编译插件,他是将编译的js放入内存中并且引入到指定的html中。所以并没有生成到build文件夹下,如果想生成还需要手动使用webpack命令

开始React和第三方结合


React-bootstrap的学习:http://react-bootstrap.github.io/components.html#navbars

npm install react-bootstrap --save-dev

页面引入css:

<link href="https://cdn.bootcss.com/bootstrap/3.3.6//css/bootstrap.min.css" rel="stylesheet">

js

const React =require('react');
const ReactDOM = require('react-dom');

var Nav = require('react-bootstrap').Nav;
var NavItem = require('react-bootstrap').NavItem;
var NavDropdown = require('react-bootstrap').NavDropdown;
var MenuItem = require('react-bootstrap').MenuItem;
var Navbar = require('react-bootstrap').Navbar; 

let MyNav = React.createClass({
    render:function()
    {
        return  <Navbar>
                        <Navbar.Header>
                          <Navbar.Brand>
                            <a href="#">React-Bootstrap</a>
                          </Navbar.Brand>
                        </Navbar.Header>
                        <Nav>
                          <NavItem eventKey={1} href="#">Link</NavItem>
                          <NavItem eventKey={2} href="#">Link</NavItem>
                          <NavDropdown eventKey={3} title="Dropdown" id="basic-nav-dropdown">
                            <MenuItem eventKey={3.1}>Action</MenuItem>
                            <MenuItem eventKey={3.2}>Another action</MenuItem>
                            <MenuItem eventKey={3.3}>Something else here</MenuItem>
                            <MenuItem divider />
                            <MenuItem eventKey={3.3}>Separated link</MenuItem>
                          </NavDropdown>
                        </Nav>
               </Navbar>
    }
})

ReactDOM.render(<MyNav />, document.getElementById('demo'));

编译即可看到结果


React-amazeui(PC端)的学习:http://amazeui.org/react/getting-started

npm install amazeui-react --save-dev

npm install  babel-preset-stage-0

npm install babel-plugin-transform-object-rest-spread 

.babelrc

{
  "presets":["es2015","react","stage-0"],
  "plugins":['transform-object-rest-spread']
}

index.js(demo1)

const React =require('react');
const ReactDOM = require('react-dom');
const AMUIReact = require('amazeui-react');

var props = {
  title: 'Amaze UI',
  link: '#title-link',
  data: {
    left: [
      {
        link: '#left-link',
        icon: 'home'
      }
    ],
    right: [
      {
        link: '#right-link',
        icon: 'bars'
      }
    ]
  },
  onSelect: function(nav, e) {
    e.preventDefault();
    console.log('你点击了', nav);
    // do something
  }
};

ReactDOM.render(<AMUIReact.Header {...props} />, document.getElementById('demo'));

index.js(demo2)

const React =require('react');
const ReactDOM = require('react-dom');
const AMUIReact = require('amazeui-react');
const Panel = AMUIReact.Panel;

let MyPanel = React.createClass({
    render:function()
    {
        return <div>
    <Panel header="面板标题">
      默认面板
    </Panel>
    <Panel header="面板标题" amStyle="primary">
      primary - 面板
    </Panel>
    <Panel header="面板标题" amStyle="secondary">
      secondary - 面板
    </Panel>
    <Panel header="面板标题" amStyle="success">
      success - 面板
    </Panel>
    <Panel header="面板标题" amStyle="warning">
      warning - 面板
    </Panel>
    <Panel header="面板标题" amStyle="danger">
      danger - 面板
    </Panel>
  </div>
    }
})

ReactDOM.render(<MyPanel />, document.getElementById('demo'));

amazeui touch(移动端):http://t.amazeui.org/#/docs?_k=4cmux8

#下载npm install --save-dev amazeui-touch
sudo npm install react-router --save-dev
#根据错误提示和 amazeui-touch 下的.babelrc文件中的内容,下载如下内容
sudo npm install  babel-preset-stage-0
sudo npm install babel-plugin-transform-object-assign --save

sudo npm install babel-plugin-add-module-exports --save-dev

sudo npm install transform-object-rest-spread
#这个是根据错误提示加入的

sudo npm install react-addons-css-transition-group --save-dev

sudo npm install babel-preset-stage-0 --save-dev   #注意要在.babelrc和webpack.config.js的配置位置中加入stage-0才行

为了更好的配合编译,推荐将webpack.config.js中的entry配置为如下示例。

在html中只需要加载如下两个Js:

<script src="http://localhost:9898/webpack-dev-server.js"></script>  <!-- 固定写法,不同的只是端口号 -->
<script type="text/javascript" src='main.js'></script>  <!-- 按需配置,按需加载 -->

并且注意,热编译的html必须在根目录。

    entry: {
        //代表入口(总)文件 ,可以写多个。
        main:['./src/main.js'],
        user:['./src/login.js']
    },

html

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Document</title>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="description" content="">
    <meta name="keywords" content="">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>Amaze UI Touch</title>
    <meta name="renderer" content="webkit">
    <!-- No Baidu Siteapp-->
    <meta http-equiv="Cache-Control" content="no-siteapp">
    <link rel="alternate icon" type="image/png" href="i/favicon.png">
    <link rel="apple-touch-icon-precomposed" href="i/app-icon72x72@2x.png">
    <meta name="apple-mobile-web-app-title" content="AMUI React">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link rel="stylesheet" href="https://npmcdn.com/amazeui-touch@1.0.0-beta.3/dist/amazeui.touch.min.css">
</head>
<body>
    <div id="demo"></div>

    <script src="http://localhost:9898/webpack-dev-server.js"></script>
    <script type="text/javascript" src='index-webpack.js'></script>

</body>
</html>

demo1:

var React = require('react');
var ReactDOM = require('react-dom');
import {Button} from 'amazeui-touch';

ReactDOM.render(
    <Button>Hello World!</Button>,
    document.getElementById('demo')
)  

demo2:剥离引用(口述)

新建一个card.js,随意利用React.createClass创建一个类,命名为CardExample,然后exports.CardExample = CardExample;

在index.js中.其中react和react-dom不需要担心重复引用的问题,系统自动会判断

var React = require('react');
var ReactDOM = require('react-dom');
var card = require('./card.js');

ReactDOM.render(
    <card.CardExample />,
    document.getElementById('demo')
)  

学习蚂蚁:http://ant.design/docs/react/introduce

npm install antd

demo1

const React =require('react');
const ReactDOM = require('react-dom');

const Table = require('antd').Table;

const dataSource = [{
  key: '1',
  name: '胡彦斌',
  age: 32,
  address: '西湖区湖底公园1号'
}, {
  key: '2',
  name: '胡彦祖',
  age: 42,
  address: '西湖区湖底公园1号'
}];

const columns = [{
  title: '姓名',
  dataIndex: 'name',
  key: 'name',
}, {
  title: '年龄',
  dataIndex: 'age',
  key: 'age',
}, {
  title: '住址',
  dataIndex: 'address',
  key: 'address',
}];

ReactDOM.render(<Table dataSource={dataSource} columns={columns} />, document.getElementById('demo'));

demo2

const React =require('react');
const ReactDOM = require('react-dom');

const Table = require('antd').Table;
const Transfer = require('antd').Transfer;
const dataSource = require('antd').dataSource;
const columns = require('antd').columns;

const App = React.createClass({
  getInitialState() {
    return {
      mockData: [],
      targetKeys: [],
    };
  },
  componentDidMount() {
    this.getMock();
  },
  getMock() {
    const targetKeys = [];
    const mockData = [];
    for (let i = 0; i < 20; i++) {
      const data = {
        key: i,
        title: `内容${i + 1}`,
        description: `内容${i + 1}的描述`,
        chosen: Math.random() * 2 > 1,
      };
      if (data.chosen) {
        targetKeys.push(data.key);
      }
      mockData.push(data);
    }
    this.setState({ mockData, targetKeys });
  },
  handleChange(targetKeys, direction, moveKeys) {
    console.log(targetKeys, direction, moveKeys);
    this.setState({ targetKeys });
  },
  render() {
    return (
      <Transfer
        dataSource={this.state.mockData}
        targetKeys={this.state.targetKeys}
        onChange={this.handleChange}
        render={item => item.title}
      />
    );
  },
});

ReactDOM.render(<App />, document.getElementById('demo'));

官方路由

学习地址:http://www.ruanyifeng.com/blog/2016/05/react_router.html?utm_source=tool.lu

官方github:https://github.com/ReactTraining/react-router

下载:$ npm install -S react-router

demo

const React =require('react');
const ReactDOM = require('react-dom');
import { Router, Route, hashHistory } from 'react-router';

let TeacherForm = React.createClass({
    render()
    {
        return <form id='TeacherForm'>
                    <h2>教师登录</h2>
                     <div className='control-group input-append'>
                            <input type='text' name='nickname' id='nickname' data-required='true' />

                            <label for='nickname' className='add-on'><span className='icon-asterisk'></span> Nickname</label>
                        </div>

                        <div className='control-group input-append'>
                            <input type='text' name='site' id='site' />

                            <label for='site' className='add-on'>Site</label>
                        </div>

                        <div className='control-group input-append'>
                            <input type='text' name='age' id='age' data-required data-pattern='^[0-9]+$' />

                            <label for='age' className='add-on'><span className='icon-asterisk'></span> Age</label>
                        </div>

                        <div className='btn-group'>
                            <button type='submit' className='btn btn-primary'>Send</button>

                            <button type='reset' className='btn'>Reset</button>
                        </div>
                </form>
    }
})

let StudentForm = React.createClass({
    render:function()
    {
        return  <form id='StudentForm'>
                    <h2>学生登录</h2>
                     <div className='control-group input-append'>
                            <input type='text' name='nickname' id='nickname' data-required='true' />

                            <label for='nickname' className='add-on'><span className='icon-asterisk'></span> Nickname</label>
                        </div>

                        <div className='control-group input-append'>
                            <input type='text' name='site' id='site' />

                            <label for='site' className='add-on'>Site</label>
                        </div>

                        <div className='control-group input-append'>
                            <input type='text' name='age' id='age' data-required data-pattern='^[0-9]+$' />

                            <label for='age' className='add-on'><span className='icon-asterisk'></span> Age</label>
                        </div>

                        <div className='btn-group'>
                            <button type='submit' className='btn btn-primary'>Send</button>

                            <button type='reset' className='btn'>Reset</button>
                        </div>
                </form>
    }
})

ReactDOM.render((
  <Router history={hashHistory}>
    <Route path="/" component={StudentForm}/>
    <Route path="t" component={TeacherForm}/>
    <Route path="s" component={StudentForm}/>
  </Router>
), document.getElementById('form'));

学习 React(jsx语法) + es2015 + babel + webpack的更多相关文章

  1. 2. React JSX语法及特点介绍

    什么是JSX         JSX 是一种类 XML 语言,全称是 JavaScript XML .React 可以不使用 JSX来编写组件,但是使用JSX可以让代码可读性更高.语义更清晰.对 Re ...

  2. React JSX语法说明

    原文:http://my.oschina.net/leogao0816/blog/379487 什么是JSX? 在用React写组件的时候,通常会用到JSX语法,粗看上去,像是在Javascript代 ...

  3. React(JSX语法)-----JSX基本语法

    JSX------HTML tags vs React Components: 1.To render a html tag,just use lower-case tag names in JSX; ...

  4. React(JSX语法)----动态UI

    1.React honws how to bubble and capture events according to the spec,and events passed to your event ...

  5. React(JSX语法)----JSX拼写

    注意:For DOM differences,such as the inline style attribute,check here. // bad: it displays "FIrs ...

  6. React(JSX语法)-----JSX属性

    1. if you know all the propertities that you want to place on a component ahead of time,it is easy t ...

  7. 22-React JSX语法

    React JSX语法 JSX只是一个语法糖,每一个XML标签都会被JSX转换工具转换成纯Javascript代码,当然你想直接使用纯Javascript代码写也是可以的,只是利用JSX,组件的结构和 ...

  8. 【JAVASCRIPT】React学习-JSX 语法

    摘要 react 学习包括几个部分: 文本渲染 JSX 语法 组件化思想 数据流 JSX 语法 1. 定义 JSX 是javascript + xml 的合集,我们可以将javascript 与 ht ...

  9. React基础语法学习

    React主要有如下3个特点: 作为UI(Just the UI) 虚拟DOM(Virtual DOM):这是亮点 是React最重要的一个特性 放进内存 最小更新的视图,差异部分更新 diff算法 ...

随机推荐

  1. 网络爬虫: 从allitebooks.com抓取书籍信息并从amazon.com抓取价格(3): 抓取amazon.com价格

    通过上一篇随笔的处理,我们已经拿到了书的书名和ISBN码.(网络爬虫: 从allitebooks.com抓取书籍信息并从amazon.com抓取价格(2): 抓取allitebooks.com书籍信息 ...

  2. 弥补学生时代的遗憾~C#注册表情缘

    记得当时刚接触C#的时候,喜欢编写各种小软件,而注册表系列和网络系列被当时的我认为大牛的必备技能.直到我研究注册表前一天我都感觉他是那么的高深. 今天正好有空,于是就研究了下注册表系列的操作,也随手封 ...

  3. c# 实现简单udp数据的发送和接收

    服务端代码 static void Main(string[] args) { UdpClient client = null; string receiveString = null; byte[] ...

  4. XML格式示例 与 XML操作(读取)类封装

    header('Content-Type: text/xml'); <?xml version="1.0" encoding="utf-8" standa ...

  5. LCA

    2016.1.28 LCA,就是最近公共祖先,这里介绍倍增的算法. 首先我们要预处理,设f[i][j]为编号为i的节点的2j级祖先,所谓2j级祖先,就是从i节点开始往树的上层数2j个节点.如下图所示 ...

  6. ios wax热更新之安装wax(xcode7.3.1)

    通过Finder浏览到你保存该项目的文件夹.创建三个新的文件夹:wax.scripts和Classes. 第一:首先,下载源代码的压缩包.Wax放在GitHub上(https://github.com ...

  7. Scala入门学习笔记四--List使用

    前言 本篇将介绍一个和Array很相似的集合List,更多内容请参考:Scala教程 本篇知识点概括 List的构造 List与Array的区别 List的常用方法 List伴生对象的方法 ::和:: ...

  8. 关于Python脚本开头两行的:#!/usr/bin/python和# -*- coding: utf-8 -*-的作用 – 指定文件编码类型

    #!/usr/bin/python指定用什么解释器运行脚本以及解释器所在的位置 # -*- coding: utf-8 -*-用来指定文件编码为utf-8的PEP 0263 -- Defining P ...

  9. HTTPD服务 openssl的https服务机制

    环境: 环境: httpd服务器:10.140.165.169 CA服务器:10.140.165.93 CA服务器配置: 1.安装openssl [root@cnhzdhcp16593 ~]# yum ...

  10. source insight 注册码

    分享一下google来的 呵呵 Source Insight,一个无比强大的工具.一个很好的查看代码的工具.到它的官网上去看一下,就知道,世界上基本上所有的大的软件公司,都在用这个工具.习惯了这个工具 ...