Trim trailing whitespaces

kdchang · Nov 21, 2016 · 6a7cf30 · 6a7cf30
1 parent 4590cc4
commit 6a7cf30
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 13 deletions.
diff --git a/Ch04/README.md b/Ch04/README.md
@@ -1,4 +1,4 @@
-# Ch04 Props/State 基礎與 Component 生命週期 
+# Ch04 Props/State 基礎與 Component 生命週期
 
 1. [Props、State、Refs 與表單處理](https://github.com/kdchang/reactjs101/blob/master/Ch04/props-state-introduction.md)
 2. [React Component 規格與生命週期（Life Cycle）](https://github.com/kdchang/reactjs101/blob/master/Ch04/react-component-life-cycle.md)

diff --git a/Ch04/props-state-introduction.md b/Ch04/props-state-introduction.md
@@ -51,7 +51,7 @@ HelloMessage.propTypes = {
 
 // Prop 預設值，若對應 props 沒傳入值將會使用 default 值 Zuck
 HelloMessage.defaultProps = {
- name: 'Zuck', 
+ name: 'Zuck',
 }
 
 ReactDOM.render(<HelloMessage name="Mark" />, document.getElementById('app'));
@@ -74,7 +74,7 @@ HelloMessage.propTypes = {
 
 // Prop 預設值，若對應 props 沒傳入值將會使用 default 值 Zuck。用法等於 ES5 的 getDefaultProps
 HelloMessage.defaultProps = {
- name: 'Zuck', 
+ name: 'Zuck',
 }
 
 ReactDOM.render(<HelloMessage name="Mark" />, document.getElementById('app'));
@@ -112,7 +112,7 @@ app.js：
 class Timer extends React.Component {
 	constructor(props) {
 		super(props);
-		// 與 ES5 React.createClass({}) 不同的是 component 內自定義的方法需要自行綁定 this context，或是使用 arrow function 
+		// 與 ES5 React.createClass({}) 不同的是 component 內自定義的方法需要自行綁定 this context，或是使用 arrow function
         this.tick = this.tick.bind(this);
 		// 初始 state，等於 ES5 中的 getInitialState
 		this.state = {
@@ -127,15 +127,15 @@ class Timer extends React.Component {
 	componentDidMount() {
 	    this.interval = setInterval(this.tick, 1000);
 	}
-	// componentWillUnmount 為 component 生命週期中 component 即將移出插入的節點的階段。這邊移除了 setInterval 效力 
+	// componentWillUnmount 為 component 生命週期中 component 即將移出插入的節點的階段。這邊移除了 setInterval 效力
 	componentWillUnmount() {
 		clearInterval(this.interval);
 	}
 	// render 為 class Component 中唯一需要定義的方法，其回傳 component 欲顯示的內容
 	render() {
 	    return (
 	      <div>Seconds Elapsed: {this.state.secondsElapsed}</div>
-	    );		
+	    );
 	}
 }
 
@@ -192,7 +192,7 @@ class TodoApp extends React.Component {
 		}
 	}
 	onChange(e) {
-    	this.setState({text: e.target.value});		
+    	this.setState({text: e.target.value});
 	}
 	handleSubmit(e) {
     	e.preventDefault();
@@ -261,7 +261,7 @@ class MarkdownEditor extends React.Component {
 		// 將使用者輸入的 Markdown 語法 parse 成 HTML 放入 DOM 中，React 通常使用 virtual DOM 作為和 DOM 溝通的中介，不建議直接操作 DOM。故使用時的屬性為 dangerouslySetInnerHTML
 		rawMarkup() {
 	    const md = new Remarkable();
-	    return { __html: md.render(this.state.value) };		
+	    return { __html: md.render(this.state.value) };
 	}
 	render() {
 	    return (
@@ -277,7 +277,7 @@ class MarkdownEditor extends React.Component {
 	          dangerouslySetInnerHTML={this.rawMarkup()}
 	        />
 	      </div>
-	    );	
+	    );
 	}
 }
 

diff --git a/Ch04/react-component-life-cycle.md b/Ch04/react-component-life-cycle.md
@@ -26,7 +26,7 @@
 
 	// Prop 預設值，若對應 props 沒傳入值將會使用 default 值，為每個實例化 Component 共用的值
 	MyComponent.defaultProps = {
-	 	name: '', 
+	 	name: '',
 	}
 
 	// 將 <MyComponent /> 元件插入 id 為 app 的 DOM 元素中
@@ -48,9 +48,9 @@
 
 	// Prop 預設值，若對應 props 沒傳入值將會使用 default 值
 	MyComponent.defaultProps = {
-		name: '', 
+		name: '',
 	}
-	
+
 	// 將 <MyComponent /> 元件插入 id 為 app 的 DOM 元素中
 	ReactDOM.render(<MyComponent name="Mark"/>, document.getElmentById('app'));
 	```
@@ -77,7 +77,7 @@ React Component，就像人會有生老病死一樣有生命週期。一般而
 3. Unmounting
 	- componentWillUnmount()
 
-很多讀者一開始學習 Component 生命週期時會覺得很抽象，所以接下來用一個簡單範例讓大家感受一下 Component 的生命週期。讀者可以發現當一開始載入元件時第一個會觸發 `console.log('constructor');`，依序執行 `componentWillMount`、`componentDidMount` ，而當點擊文字觸發 `handleClick()` 更新 `state` 時則會依序執行 `componentWillUpdate`、`componentDidUpdate`：  
+很多讀者一開始學習 Component 生命週期時會覺得很抽象，所以接下來用一個簡單範例讓大家感受一下 Component 的生命週期。讀者可以發現當一開始載入元件時第一個會觸發 `console.log('constructor');`，依序執行 `componentWillMount`、`componentDidMount` ，而當點擊文字觸發 `handleClick()` 更新 `state` 時則會依序執行 `componentWillUpdate`、`componentDidUpdate`：
 
 HTML Markup：
 ```html