wirenc-CSDN博客

原创 1.2.1 JSX

判断一个元素是HTML还是React组件的原则就是看第一个字母是否大写，import React,{Component} from 'react';class ClickCounter extends Component{ constructor(props){ super(props); this.onClickButton = this.onClickButton.bind

2017-06-25 12:14:36 343

原创 1.2 增加一个新的react组件

src/index.jsimport React from 'react';import ReactDOM from 'react-dom';import App from './App';import ClickCounter from './ClickCounter';import registerServiceWorker from './registerServiceWorker';

2017-06-25 12:08:38 412

原创 1.1.1 create-react-app工具

npm install --glocal create-react-appcreate-react-app first_react_appcd first_react_appnpm startvisit http://localhost:3000/

2017-06-25 10:47:10 499

原创 react+express +materialui模板

https://github.com/rccoder/react-express-webpack-cli simple CLI for react and express with webpackWhatReact Express 4.x webpack hot-dev proxy material-ui …这些技术点都是想要的

2017-06-11 12:32:49 509

翻译官网https://github.com/reactjs/react-router-tutorial学习

01-setting-upfrom https://github.com/reactjs/react-router-tutorial/tree/master/lessons/01-setting-up Clone the Tutorialgit clone https://github.com/reactjs/react-router-tutorialcd react-router-tuto

2017-02-17 20:57:16 3005

http://blog.leanote.com/post/qqxufo/React%E6%B8%B2%E6%9F%93%E6%9C%8D%E5%8A%A1%E5%99%A8%E7%AB%AF%E7%9A%84%E5%85%A5%E9%97%A8%E6%95%99%E7%A8%8Bhttp://raghibm.com/blog/gettings-started-with-express-react-v

2017-02-09 13:04:09 1501

转载 app W3 reactjs 学习

react教程react 安装mkdir reactapp 801 cd reactapp/ 802 npm init -y 803 npm install --save react react-dom 804 npm install --save-dev babel-core babel-loader babel-preset-react babel-preset-es20

2017-02-08 15:37:46 508

原创从0开始学 react

1 webpackmkdir chong0kaishixuereactcd chong0kaishixuereactnpm initnpm install webpack --save-devnpm install -save-dev babel-core babel-loader babel-preset-es2015 babel-preset-reactnpm install --s

2017-02-04 01:22:33 677

原创 express+react+redux from youtube

1 install Expressmkdir expressreactredux 1012 cd expressreactredux/ 1013 npm init 1014 npm install --save express 1015 npm install --save pug2 installing babel,webpak&react

2017-02-03 17:29:19 545

原创注意，react声明组件时，第一个字母必须大写。

注意，react声明组件时，第一个字母必须大写。当JSX包含多行代码时，将它们包含在小括号中。/// badrender() { return <MyComponent className="long body" foo="bar"> <MyChild /> </MyComponent>;}// goodrender() { return (

2017-02-02 20:27:07 5602

原创报错：Error:SyntaxError main.jsx:Unexpected token(3:9)

ReactDOM.render( ^ … );解决：先在project的根目录新建一个空白文件.babelrc 安装$npm install babel-plugin-transform-react-jsx 在.babelrc文件中加入： {"plugins":["transform-react-jsx"]}

2017-02-01 23:05:57 2864

原创 React&Redux

apprendre de youtube . 1**Introduction**2. Project Setup-Serve index.html with Expressjsmkdir reddice cd reddice/ npm init -y git init npm install express@latest –save npm install –save

2017-01-30 08:53:59 930

原创 nodejsmysqlconnectiontutorial

mkdir nodejsmysqlconnectiontutorial974 cd nodejsmysqlconnectiontutorial/ 975 npm init 976 npm install –save express@latest mysql@latestvi script.jsvar express = require('express');var mysql =

2017-01-30 00:40:17 266

原创 16 Functional Stateless Components

vi src/Contact.jsimport React from 'react';const Contact = ({contact,item}) => <ul> <li> {contact.name} {contact.phone} {item}</li> </ul>export default Contact;vi src

2017-01-29 22:43:55 285

原创 15 Using Forms

vi src/ContactsList.jsimport React from 'react';import Contact from './Contact';class ContactsList extends React.Component{ constructor(props){ super(props); this.state ={

2017-01-29 22:34:38 285

原创 14 Building A Search Filter

vi src/ContactsList.jsimport React from 'react';import Contact from './Contact';class ContactsList extends React.Component{ constructor(){ super(); this.state ={ sear

2017-01-29 22:16:52 280

原创 13 Controlled Inputs

vi src/ContactsList.jsimport React from 'react';import Contact from './Contact';class ContactsList extends React.Component{ constructor(){ super(); this.state ={ sear

2017-01-29 22:05:46 296

原创 12 Iterationg Over Data With JSX

vi src/Contact.jsimport React from 'react';class Contact extends React.Component{ render(){ console.log(this.props.contacts); return( <ul> <li> {this.props.co

2017-01-29 21:46:02 296

原创 11 Passing Date Into Our Components

vi ContactsList.jsimport React from 'react';class ContactsList extends React.Component{ render(){ console.log(this.props.contacts); return( <ul> <li> {this.p

2017-01-29 21:28:01 270

原创 10 Exporting&importing A Child Component

vi src/ContactsList.jsimport React from 'react';class ContactsList extends React.Component{ render(){ return( <ul> <li> Scott 555555555</li> </ul>

2017-01-29 21:03:49 235

原创 9.Creating&Rendering Our App

App.jsimport React from 'react';import ReactDOM from 'react-dom'class App extends React.Component {render(){ return( <div> <h1> Contacts List</h1> </div> )}}Reac

2017-01-29 19:56:35 184

原创 7.5 updating to React15

npm install react-dom@latest –save npm install react@latest –save npm install babel-preset-es2015@latest babel-preset-react@latest –save-devcat package.json "dependencies": { "react": "^15.4.

2017-01-29 19:04:29 213

原创 8 Basic Webpack Configuration&Server

pwd /7reactforeveryonevi webpack.config.jsmodule.exports= { entry : [ './src/App.js' ], output: { path: __dirname, filename: 'app.js' }, module:{ loader:[

2017-01-29 18:47:53 296

原创 7 Starting A Real Project

mkdir 7reactforeveryone cd 7reactforeveryone/npm initcat package.json npm install babel-core@latest –save-dev npm install babel-loader@latest –save-dev npm install webpack@latest webpack-d

2017-01-29 18:33:14 181

原创 6 click Events&A Basic Lifecycle Method

<!DOCTYPE html> <html> <head> <script src="https://unpkg.com/react@15/dist/react.js"></script> <script src="https://unpkg.com/react-dom@15/dist/react-dom.js"></script>

2017-01-29 17:24:33 272

原创 5 working with state

<!DOCTYPE html> <html> <head> <script src="https://unpkg.com/react@15/dist/react.js"></script> <script src="https://unpkg.com/react-dom@15/dist/react-dom.js"></script>

2017-01-29 17:16:27 210

原创 4 conditionals in JSX&parent child relationships

</head> <body> <div id="area" ></div> <script type="text/babel"> var HelloWorld = React.createClass({ propTypes:{ name: React.Pr

2017-01-29 17:05:14 219

原创 2 our first React Component

2017-01-29 16:38:25 231

原创 1 getting started &understanding react

2017-01-29 16:12:28 188

原创 02章 sublime配置

47、手把手教React Native实战之API学习定时器与手机定位Geolocation定时器API：setTimeout、setInterval、setImmediate、requestAnimationFrame 跟浏览器中的一致setTimeout：设置定时任务，隔多久去执行setInterval：设置循环执行的任务，每隔多久循环执行一次setImmediate：设置立即执行的任务requ

2016-11-23 15:28:35 253

原创 ecshop SQL注入漏洞 admin/shopinfo.php ecshop SQL注入漏洞

阿里云这点做的很厚道，真心不错/home/wwwroot/admin/shopinfo.php ecshop SQL注入漏洞先备份好文件后再操作/admin/shopinfo.php修复方法(大概在第53、71、105、123行，4个地方修复方式都一样) admin_priv(‘shopinfo_manage’); 修改为 admin_priv(‘shopinfo

2016-10-30 13:35:51 6348

原创［原］东方耀react-native 46-开源组件react-native-camera

46、手把手教React Native实战之开源组件react-native-camera推荐一个跨平台的rn-camera-roll：https://www.npmjs.com/package/rn-camera-rollA Camera component for React Native. Also supports barcode scanning!二维码扫描原生Android Zxing

2016-10-02 11:22:16 1495

原创解决：wordpress WPImageEditorImagick 指令注入漏洞

服务器放在阿里云有很大一个好处，就是平台有啥bug,会被查出来，根据这个提示，去解决漏洞名称：wordpress WP_Image_Editor_Imagick 指令注入漏洞在/wp-includes/media.php的_wp_image_editor_choose函数内部找到：1 $implementations = apply_filters( ‘wp_image_editors’, arr

2016-10-01 10:13:20 589

原创【原】东方耀手把手教React Native实战之45API学习CameraRoll_笔记[难］

CameraRoll模块提供了对手机中保存的图片、视频文件进行遍历访问与操作。提供两个静态方法static getPhotos(params: object)可以得到手机中所有的图片和视频（不仅仅是使用摄像头拍摄的照片、视频，还有各个应用自己下载到手机的图片与视频）params：对象一些筛选的规则有4个成员变量1.first 数值希望获取多少张图片的信息2.groupTypes 字符串默

2016-09-30 14:52:51 3842

原创手把手教React Native实战之44API学习-网络状态与数据交互

网络连接状态NetInfo：获取网络状态是异步的，使用了js的Promise机制Android平台的网络连接类型状态如下:1.NONE 设备没有网络连接2.BLUETOOTH 蓝牙数据连接3.DUMMY 虚拟数据连接4.ETHERNET 以太网数据连接5.MOBILE 手机移动网络数据连接6.MOBILE_DUN 拨号移动网络数据连接7.MOBILE_HIPRI 高权限的移动网络数

2016-09-30 14:16:46 993

原创【原】东方耀REACT-NATIVE学习43，ios日期组件 ActionSheetIOS

需求：分享和弹出多项选择操作！在IOS开发中，ActionSheet提供了这样的功能，而React Native同样封装了该功能，那就是ActionSheetIOS提供了两个静态方法：static showActionSheetWithOptions(options,callback):在iOS设备上显示一个ActionSheet弹出框，其中options参数为一个对象，其属性必须包含以下一项或多项

2016-09-30 13:29:40 561

原创【原】东方耀REACT-NATIVE学习42，ios日期组件 DatePickerIOS

日期时间选择器在IOS中是以组件的形式 DatePickerIOS支持View组件的所有属性，可以设置他的宽度、高度、位置等这是一个受约束的(Controlled)组件，所以你必须监听onDateChange回调函数并且及时更新date属性来使得组件更新，否则用户的修改会立刻被撤销来确保当前显示值和props.date一致。除了View组件的属性，DatePickerIOS组件还支持如下属性：da

2016-09-30 12:28:00 1198

原创 [原]东方耀手把手教React Native实战之API学习DatePickerAndroid与TimePickerAndroid

41、手把手教React Native实战之API学习DatePickerAndroid与TimePickerAndroid日期、时间选择器 Android中是以api的形式，IOS是以组件的形式DatePickerAndroid：static open(options: Object) 打开一个标准的Android日期选择器的对话框可选的options对象的key值如下：date (Date对象

2016-09-28 07:10:33 2329

转载【原创】东方耀reactnative 视频38之-物理返回键

在上一节课代码的基础上：分析路由栈的结构(帖子后面有图片)，见该集视频教程栈：先进后出，后进先去！componentWillMount() { if (Platform.OS === ‘android’) { BackAndroid.addEventListener(‘hardwareBackPress’, this.onBackAndroid); }

2016-09-27 05:50:47 1038

原创 [原创】linux centos df -i inode No space left on device

奇怪现象，wordpress网站打不开，重跑nginx,提示 nginx.pid,no space left on device但 df -h　提示还只用了６０％的空间，怎么查也查不出原因网上查很久查不出原因，后来准备把ｎｇｉｎｘ．ｐｉｄ换个位置，在／ｔｍｐ下重新生成，发现生成不了，也是一样提示再在／ｖａｒ／ｌｏｇ下新生成一个文本，一样报错大体上知道可能是　ｉｎｏｄｅ用光了顺序来查一下　ｌｉ

2016-09-26 15:32:09 605