Time of Update: 2016-06-06
標籤:記下自己的react學習之路 ,官方文檔寫的很詳盡,學起來應該比較簡單官方文檔地址:react.http://reactjs.cn/react/docs/getting-started.html1.1 全域安裝命令列工具(依賴 npm)在任何目錄進行全域安裝,效果都是一樣的。所以可以不切入到專案檔夾。npm install -g react-tools 1.2jsx檔案轉成標準的 JavaScript: jsx --watch
Time of Update: 2016-06-27
標籤: 一、前言最近手頭的工作繁多,有研究性的項目和系統研發,正好遇到同事離職,接手了架構的UI組件,不僅需要維護和填坑,還需要開發新的功能組件。因為身在H5-Hybird的架構部門,最近團隊開始嘗試使用React-Native來做些東西。之前也有過開發iOS
Time of Update: 2016-06-25
標籤: Nodejs 一度將前端JS 推到了伺服器端,而15年FB的React-Native RN再一次將JS 推到了移動端的開發浪潮中。RN的優勢這裡不再重複,它是我們這些習慣了服務端、web端開發,而又不想去花太多時間掌握Android、IOS移動端原生開發的人員的福音,可以說是我們通向全棧工程師的快速捷徑!於是乎最近開始學習React-Native,並將學習中的一些點滴記錄下來。 網上關於RN的資料不少了,首先是環境配置,不一定非得Mac
Time of Update: 2016-06-25
標籤:1,程式結構 JS(JSX)+HTML+CSS2 首先在Sublime中建立一個html檔案 輸入html:5 按Tab鍵自動產生基礎代碼 預設語言是英文語言,修改lang="zh-cn"即為中文 具體見一下代碼: <!DOCTYPE html><html lang="en"><head><meta
Time of Update: 2016-06-22
標籤:編者:本文來自攜程架構研發部資深經理魏曉軍在第二期【攜程技術微分享】上的分享,以下為整理後的文字實錄。視頻回放可點擊這裡。關注攜程技術中心公號ctriptech,可獲知更多微分享課程資訊。 因為支援用javascript開發原生應用,React Native一推出就受到不少公司熱捧,各家都躍躍欲試。但有一個痛點是,在移動端,我們是否有必要開發多套程式:iOS、Android和H5?本次將通過對Moles架構的分享,介紹攜程在React
Time of Update: 2016-06-17
標籤: 閱讀本文需要有React的基礎知識,可以在React 入門執行個體教程和React中文官網進行基礎學習。 沒有React基礎也可以學習本文,本文主要不是學習React,而是gulp+browserify進行模組化開發。1.建立項目和環境搭建 我們可以先建立一個檔案夾叫react_item,作為項目的根目錄。 開啟命令列,cd到項目的根目錄下,我們需要通過npm安裝gulp,輸入:npm install gulp
Time of Update: 2016-06-16
標籤:遇到的問題目前模板是自己任意定義的,樣式不好控制
Time of Update: 2016-06-15
標籤:React的屬性和狀態React資料使用兩種事物進行傳遞:1.屬性(props):在組件外部傳入,組件內部通過this.props獲得(與生俱來,不容易被改變的)2.狀態(state):在組件內部設定或更改,組件內部通過this.state獲得(狀態是後天獲得的,經常會發生改變的)屬性專一,狀態多情 React屬性(Props)屬性是在一個組件被聲明的時候就被(父組件)賦予的,並且不可被修改屬性被傳遞的方式一般在組件被調用時候被傳入屬性可以使字串、數組、對象...直接把Objec
Time of Update: 2016-06-07
標籤:現在只能在MAC系統上安裝。1. 首先,HomeBrew這是一個包管理庫,用來下載其它工具。開啟網站:brew.sh網頁有個命令 /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)" 在命令列中運行上面的命令,按照提示安裝即可。2. nvmnode.js的版本管理器brew install nvm 安裝完後,在提示裡是這樣寫的You
Time of Update: 2016-06-04
標籤:We will learn how to add React Router to a Redux project and make it render our root component. Install: npm install --save react-router import React from ‘react‘;import {Provider} from ‘react-redux‘;import {Router, Route} from
Time of Update: 2016-06-04
標籤:簡介:React是Facebook開發的一款JS庫React解決了什麼問題?1)、首先是以往mvc模式的缺陷,當程式碼程式庫龐大時,mvc非常的複雜,每添加新的功能,項目的複雜度就幾何倍的增長,導致代碼的維護性很差,所以mvc不合適太大型的前端應用。2)模型和視圖間可能存在的雙向資料流動React的特點是什嗎?1)簡單2)聲明式另外在react官網上面(http://facebook.github.io/react/blog/2013/06/05/why-react.html),還可以瞭解
Time of Update: 2016-06-01
標籤:React的使用與JSX的轉換前置技能:Chrome瀏覽器 一.拿糖:React的使用React v0.14 RC 發布,主要更新項目: 兩個包: React 和 React DOM DOM node refs 無狀態的功能組件 棄用 react-tools 編譯器最佳化 吃糖:開門見山,上代碼。<!DOCTYPE html><html><head>
Time of Update: 2016-05-30
標籤:‘use strict‘;React.createClass({ //1.建立階段 getDefaultProps:function(){ //在建立類的時候被調用 console.log(‘getDefaultProps‘); return {}; }, //2.執行個體化階段 getInitailState:function(){ //擷取this.state的預設值
Time of Update: 2016-05-28
標籤:一 開發條件1. HomebrewHomebrew, in order to install the required NodeJS, in addition to some recommended installs./usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)" 2.Node使用Homebrew去安裝Node.brew
Time of Update: 2016-05-25
標籤:我又回來啦!由於最近一直在做公司的項目,而且比較急。如今項目已經迭代到第三期,可以緩一緩了。。。今天在公司裡聽前端的說,這個項目本來是用React-Native做的(去年10月份),但是做到一半發現坑太多,就中途放棄了,於是讓我們android和iOS重新開發。。。作為非常喜歡這個技術的我來說,表示相當的不服。於是我打算利用閑暇時間做一個一模一樣的出來,反正介面我都有(嘻嘻)說實話,最近一直再用android做開發,而且時間也不寬裕,react-native有點生疏了。好了,廢話不多說,今
Time of Update: 2016-05-13
標籤:用於從一個值範圍選取一個值的組件。一、屬性名稱類型說明disabledbool如果為true,使用者無法移動這個滑動條。預設值為false。maximumValuenumber滑動條最大值。預設為1。minimumValuenumber滑動條最小值,預設為0。onSlidingCompletefunction當使用者完成值的改變被回調的方法。onValueChangefunction當使用者正在滑動滑動條持續回調的方法;stepnumber滑動條的最小單位。這個值應該在0到最大值-最小值之
Time of Update: 2016-05-06
標籤: 作為一個JS、CSS、RN新手,總是會遇到各種樣式。在不知道樣式有些什麼的情況下難以很好的繪製布局。所以這裡整理了一下幾個常用布局的樣式。View Style支援Flexbox、ShadowPropTypesIOS、Transforms屬性。背面可見度backfaceVisibility enum(‘visible‘, ‘hidden‘)背景顏色backgroundColor string邊框顏色borderColor stringborderTopColor
Time of Update: 2016-04-27
標籤:今天,開始學習第二節!!!工欲善其事,必先利其器react推薦我們使用webpack來打包檔案,那麼我們就用吧!(其實真心不想用啊)至於好處網上寫的天花亂墜的,大家自行解決啊...這節主要就學習怎麼配置webpack了,這玩意我搗鼓了整整一天才弄的一知半解,哎,腦子差就是吃虧...1.提前準備工作(ps:自己裝好node啊,別怪我沒提醒你)首先,你需要有一個自己的檔案夾,至於什麼名字你自己看著辦,我的叫做 reactdemo裡面放一個測試的html加一個js檔案夾 2.安裝
Time of Update: 2016-04-25
標籤:今天在寫一個簡單的RN的Demo時,一連出現了好幾個錯誤,最後幸虧得以解決,在這裡把我踩過的坑以及解決辦法分享出來:1.運行出現錯誤:Could not connect to development server.解決辦法:請將項目中 AppDelegate.m 中的 jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.ios.bundle?platform=ios&dev=true"];
Time of Update: 2016-04-20
標籤:react-native中CameraRoll模組提供了訪問本地相簿的功能。在react版本為0.23.0的項目中,不支援Android,而且在iOS中使用CameraRoll還需要我們手動操作:iOS:將RCTCameraRoll.xcodeproj添加到我們的項目中:展開項目 > Libraies 右鍵Libraies點擊 “Add Files to ‘項目名’