Add more detail about react component and fix some improper translation. (#32674)

guide/chinese/react/component/index.md

@@ -1,10 +1,10 @@
 ---
 title: React - Components
-localeTitle: 反应 - 组件
+localeTitle: React - 组件
 ---
-## 反应 - 组件
+## React - 组件
 
-组件可在react.js中重用。您可以将值注入道具，如下所示：
+组件的意义是可在react中重用。您可以将值注入组件，从而动态的展示不同的内容。如下所示：
 
 ```jsx
 function Welcome(props) { 
@@ -18,7 +18,7 @@ function Welcome(props) {
  ); 
 ```
 
-`name="Faisal Arkan"`将从`function Welcome(props)`赋予`{props.name}`值，并返回已通过`name="Faisal Arkan"`赋予值的组件，之后反应将元素转换为html。
+`name="Faisal Arkan"`将从`function Welcome(props)`赋予`{props.name}`值，并返回已通过`name="Faisal Arkan"`赋予值的组件，之后React会将此组件渲染为html。
 
 ### 声明组件的其他方法
 
@@ -27,7 +27,8 @@ function Welcome(props) {
 ### 有状态
 
 #### 类类型组件
-
+* 此组件为一个class类，继承React的Component类。通过继承，类类型组件拥有state变量，此变量可以存储这个组件当前的状态。
+* 类类型组件同时拥有state和props。
 ```jsx
 class Cat extends React.Component { 
   constructor(props) { 
@@ -53,7 +54,7 @@ class Cat extends React.Component {
 ### 无状态组件
 
 #### 功能组件（ES6的箭头功能）
-
+* 无状态组件只是一般的javascript函数。因为没有继承任何类，所以只能使用传入的props参数来注入值。
 ```jsx
 const Cat = props => { 
   return ( 
@@ -74,4 +75,4 @@ const Cat = props =>
     <p>{props.color}</p> 
   </div>; 
 
-```
+```