add switch

Author: BearJ

example/pages/cell/index.js

@@ -19,7 +19,8 @@ import { ButtonArea,
     Icon,
     Input,
     Label,
-    TextArea
+    TextArea,
+    Switch
 } from '../../../src/index';
 import Page from '../../component/page';
 import iconSrc from './images/icon.png';
@@ -114,6 +115,16 @@ export default class CellDemo extends React.Component {
                     </Cell>
                 </Cells>
 
+                <CellsTitle>开关</CellsTitle>
+                <Form>
+                    <FormCell switch>
+                        <CellBody>标题文字</CellBody>
+                        <CellFooter>
+                            <Switch/>
+                        </CellFooter>
+                    </FormCell>
+                </Form>
+
                 <Form>
                     <FormCell>
                         <CellHeader>

src/components/form/form_cell.js

@@ -19,11 +19,12 @@ export default class FormCell extends React.Component {
     };
 
     render() {
-        const { className, children, vcode, warn, ...others } = this.props;
+        const { className, children, ...others } = this.props;
         const cls = classNames({
             weui_cell: true,
-            weui_vcode: vcode,
-            weui_cell_warn: warn,
+            weui_vcode: this.props.vcode,
+            weui_cell_warn: this.props.warn,
+            weui_cell_switch: this.props.switch,
             [className]: className
         });
 

src/components/form/index.js

@@ -9,10 +9,12 @@ import Form from './form';
 import FormCell from './form_cell';
 import TextArea from './textarea';
 import Input from './input';
+import Switch from './switch';
 
 export default {
     Form,
     FormCell,
     TextArea,
-    Input
+    Input,
+    Switch
 };

src/components/form/switch.js

@@ -0,0 +1,30 @@
+/**
+ * Created by BearJ on 16/2/18.
+ */
+
+
+
+import React, { Component, PropTypes } from 'react';
+import classNames from 'classnames';
+
+export default class Switch extends React.Component {
+    static propTypes = {
+        defaultValue: PropTypes.string
+    };
+
+    static defaultProps = {
+        defaultValue: undefined
+    };
+
+    render() {
+        const { className, ...others } = this.props;
+        const cls = classNames({
+            weui_switch: true,
+            [className]: className
+        });
+
+        return (
+            <input className={cls} type="checkbox" {...others}/>
+        );
+    }
+};

src/index.js

@@ -5,7 +5,7 @@
 import {Button, ButtonArea} from './components/button/index';
 import {Cells, CellsTitle, CellsTips, Cell, CellHeader, CellBody, CellFooter} from './components/cell/index';
 import Mask from './components/mask/index';
-import {Form, FormCell, TextArea, Input} from './components/form/index';
+import {Form, FormCell, TextArea, Input, Switch} from './components/form/index';
 import Label from './components/label/index';
 import Toast from './components/toast/index';
 import Progress from './components/progress/index';
@@ -31,6 +31,7 @@ export default {
     FormCell,
     Input,
     TextArea,
+    Switch,
     Label,
     Toast,
     Progress,