improve: 给表单组件加静态setValue方法

NewDadaFE · Oct 11, 2016 · ca3525a · ca3525a
1 parent 9674765
commit ca3525a
Show file tree

Hide file tree

Showing 19 changed files with 189 additions and 19 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-impression",
-  "version": "0.4.17",
+  "version": "0.5.0",
   "author": "peter.shenlq",
   "description": "An enterprise-class UI design language and React-based implementation.",
   "main": "./lib/index.js",

diff --git a/site/src/scripts/components/impression/components/Checkbox.js b/site/src/scripts/components/impression/components/Checkbox.js
@@ -57,7 +57,7 @@ export default class Checkbox extends PureComponent {
     }
 }
 
-// 获取checkbox是否选中
+// getValue
 Checkbox.getValue = ref => {
     let { value } = ref.props,
         { main } = ref.refs;
@@ -72,3 +72,12 @@ Checkbox.getValue = ref => {
 
     return value;
 };
+
+// setValue
+Checkbox.setValue = (ref, checked) => {
+    let { main } = ref.refs;
+
+    if(ref) {
+        main.checked = !!checked;
+    }
+};
diff --git a/site/src/scripts/components/impression/components/CheckboxGroup.js b/site/src/scripts/components/impression/components/CheckboxGroup.js
@@ -102,7 +102,7 @@ export default class CheckboxGroup extends PureComponent {
     }
 }
 
-// 获取选中值
+// getValue
 CheckboxGroup.getValue = ref => {
     if(!ref) {
         return undefined;
@@ -114,3 +114,12 @@ CheckboxGroup.getValue = ref => {
 
     return ref.state.value;
 };
+
+// setValue
+CheckboxGroup.setValue = (ref, value) => {
+    if(ref && !ref.isPuppet) {
+        ref.setState({
+            value,
+        });
+    }
+};
diff --git a/site/src/scripts/components/impression/components/InlineSelect.js b/site/src/scripts/components/impression/components/InlineSelect.js
@@ -78,7 +78,7 @@ export default class InlineSelect extends PureComponent {
     }
 }
 
-// 获取值
+// getValue
 InlineSelect.getValue = ref => {
     if(!ref) {
         return undefined;
@@ -91,4 +91,13 @@ InlineSelect.getValue = ref => {
     return ref.state.value;
 };
 
+// setValue
+InlineSelect.setValue = (ref, value) => {
+    if(ref && !ref.isPuppet) {
+        ref.setState({
+            value,
+        });
+    }
+};
+
 InlineSelect.Option = InlineSelectOption;
diff --git a/site/src/scripts/components/impression/components/Input.js b/site/src/scripts/components/impression/components/Input.js
@@ -255,7 +255,7 @@ export default class Input extends PureComponent {
     }
 }
 
-// 获取Input内容
+// getValue
 Input.getValue = ref => {
     let { type } = ref.props;
 
@@ -270,3 +270,20 @@ Input.getValue = ref => {
             return ref.refs.main.value;
     }
 };
+
+// setValue
+Input.setValue = (ref, value) => {
+    let { type } = ref.props;
+
+    if(!ref) {
+        return;
+    }
+
+    switch(type) {
+        case 'file':
+            ref.refs.main.refs.main.files[0] = value;
+            break;
+        default:
+            ref.refs.main.value = value;
+    }
+};
diff --git a/site/src/scripts/components/impression/components/Radio.js b/site/src/scripts/components/impression/components/Radio.js
@@ -64,7 +64,7 @@ export default class Radio extends PureComponent {
     }
 }
 
-// 获取checkbox是否选中
+// getValue
 Radio.getValue = ref => {
     let { value } = ref.props,
         { main } = ref.refs;
@@ -79,3 +79,12 @@ Radio.getValue = ref => {
 
     return value;
 };
+
+// setValue
+Radio.setValue = (ref, checked) => {
+    let { main } = ref.refs;
+
+    if(ref) {
+        main.checked = !!checked;
+    }
+};
diff --git a/site/src/scripts/components/impression/components/RadioGroup.js b/site/src/scripts/components/impression/components/RadioGroup.js
@@ -96,7 +96,7 @@ export default class RadioGroup extends PureComponent {
     }
 }
 
-// 获取选中值
+// getValue
 RadioGroup.getValue = ref => {
     if(!ref) {
         return undefined;
@@ -108,3 +108,12 @@ RadioGroup.getValue = ref => {
 
     return ref.state.value;
 };
+
+// setValue
+RadioGroup.setValue = (ref, value) => {
+    if(ref && !ref.isPuppet) {
+        ref.setState({
+            value,
+        });
+    }
+};
diff --git a/site/src/scripts/components/impression/components/Select.js b/site/src/scripts/components/impression/components/Select.js
@@ -138,7 +138,7 @@ export default class Select extends PureComponent {
     }
 }
 
-// 获取vule函数
+// getValue
 Select.getValue = ref => {
     if(!ref) {
         return undefined;
@@ -151,4 +151,13 @@ Select.getValue = ref => {
     return ref.state.value;
 };
 
+// setValue
+Select.setValue = (ref, value) => {
+    if(ref && !ref.isPuppet) {
+        ref.setState({
+            value,
+        });
+    }
+};
+
 Select.Option = SelectOption;
diff --git a/site/src/scripts/components/impression/components/Switch.js b/site/src/scripts/components/impression/components/Switch.js
@@ -52,7 +52,7 @@ export default class Switch extends PureComponent {
     }
 }
 
-// 获取Swtich是否选中
+// getValue
 Switch.getValue = ref => {
     let { value } = ref.props,
         { main } = ref.refs;
@@ -67,3 +67,12 @@ Switch.getValue = ref => {
 
     return value;
 };
+
+// setValue
+Switch.setValue = (ref, checked) => {
+    let { main } = ref.refs;
+
+    if(ref) {
+        main.checked = !!checked;
+    }
+};
diff --git a/site/src/scripts/components/impression/components/Upload.js b/site/src/scripts/components/impression/components/Upload.js
@@ -121,7 +121,12 @@ export default class Upload extends PureComponent {
     }
 }
 
-// 获取上传文件
+// getValue
 Upload.getValue = ref => {
     return ref ? ref.refs.main.files[0] : undefined;
 };
+
+// setValue
+Upload.setValue = (ref, value) => {
+    return ref && (ref.refs.main.files[0] = value);
+};
diff --git a/src/scripts/components/Checkbox.js b/src/scripts/components/Checkbox.js
@@ -57,7 +57,7 @@ export default class Checkbox extends PureComponent {
     }
 }
 
-// 获取checkbox是否选中
+// getValue
 Checkbox.getValue = ref => {
     let { value } = ref.props,
         { main } = ref.refs;
@@ -72,3 +72,12 @@ Checkbox.getValue = ref => {
 
     return value;
 };
+
+// setValue
+Checkbox.setValue = (ref, checked) => {
+    let { main } = ref.refs;
+
+    if(ref) {
+        main.checked = !!checked;
+    }
+};
diff --git a/src/scripts/components/CheckboxGroup.js b/src/scripts/components/CheckboxGroup.js
@@ -102,7 +102,7 @@ export default class CheckboxGroup extends PureComponent {
     }
 }
 
-// 获取选中值
+// getValue
 CheckboxGroup.getValue = ref => {
     if(!ref) {
         return undefined;
@@ -114,3 +114,12 @@ CheckboxGroup.getValue = ref => {
 
     return ref.state.value;
 };
+
+// setValue
+CheckboxGroup.setValue = (ref, value) => {
+    if(ref && !ref.isPuppet) {
+        ref.setState({
+            value,
+        });
+    }
+};
diff --git a/src/scripts/components/InlineSelect.js b/src/scripts/components/InlineSelect.js
@@ -78,7 +78,7 @@ export default class InlineSelect extends PureComponent {
     }
 }
 
-// 获取值
+// getValue
 InlineSelect.getValue = ref => {
     if(!ref) {
         return undefined;
@@ -91,4 +91,13 @@ InlineSelect.getValue = ref => {
     return ref.state.value;
 };
 
+// setValue
+InlineSelect.setValue = (ref, value) => {
+    if(ref && !ref.isPuppet) {
+        ref.setState({
+            value,
+        });
+    }
+};
+
 InlineSelect.Option = InlineSelectOption;
diff --git a/src/scripts/components/Input.js b/src/scripts/components/Input.js
@@ -255,7 +255,7 @@ export default class Input extends PureComponent {
     }
 }
 
-// 获取Input内容
+// getValue
 Input.getValue = ref => {
     let { type } = ref.props;
 
@@ -270,3 +270,20 @@ Input.getValue = ref => {
             return ref.refs.main.value;
     }
 };
+
+// setValue
+Input.setValue = (ref, value) => {
+    let { type } = ref.props;
+
+    if(!ref) {
+        return;
+    }
+
+    switch(type) {
+        case 'file':
+            ref.refs.main.refs.main.files[0] = value;
+            break;
+        default:
+            ref.refs.main.value = value;
+    }
+};
diff --git a/src/scripts/components/Radio.js b/src/scripts/components/Radio.js
@@ -64,7 +64,7 @@ export default class Radio extends PureComponent {
     }
 }
 
-// 获取checkbox是否选中
+// getValue
 Radio.getValue = ref => {
     let { value } = ref.props,
         { main } = ref.refs;
@@ -79,3 +79,12 @@ Radio.getValue = ref => {
 
     return value;
 };
+
+// setValue
+Radio.setValue = (ref, checked) => {
+    let { main } = ref.refs;
+
+    if(ref) {
+        main.checked = !!checked;
+    }
+};
diff --git a/src/scripts/components/RadioGroup.js b/src/scripts/components/RadioGroup.js
@@ -96,7 +96,7 @@ export default class RadioGroup extends PureComponent {
     }
 }
 
-// 获取选中值
+// getValue
 RadioGroup.getValue = ref => {
     if(!ref) {
         return undefined;
@@ -108,3 +108,12 @@ RadioGroup.getValue = ref => {
 
     return ref.state.value;
 };
+
+// setValue
+RadioGroup.setValue = (ref, value) => {
+    if(ref && !ref.isPuppet) {
+        ref.setState({
+            value,
+        });
+    }
+};
diff --git a/src/scripts/components/Select.js b/src/scripts/components/Select.js
@@ -138,7 +138,7 @@ export default class Select extends PureComponent {
     }
 }
 
-// 获取vule函数
+// getValue
 Select.getValue = ref => {
     if(!ref) {
         return undefined;
@@ -151,4 +151,13 @@ Select.getValue = ref => {
     return ref.state.value;
 };
 
+// setValue
+Select.setValue = (ref, value) => {
+    if(ref && !ref.isPuppet) {
+        ref.setState({
+            value,
+        });
+    }
+};
+
 Select.Option = SelectOption;
diff --git a/src/scripts/components/Switch.js b/src/scripts/components/Switch.js
@@ -52,7 +52,7 @@ export default class Switch extends PureComponent {
     }
 }
 
-// 获取Swtich是否选中
+// getValue
 Switch.getValue = ref => {
     let { value } = ref.props,
         { main } = ref.refs;
@@ -67,3 +67,12 @@ Switch.getValue = ref => {
 
     return value;
 };
+
+// setValue
+Switch.setValue = (ref, checked) => {
+    let { main } = ref.refs;
+
+    if(ref) {
+        main.checked = !!checked;
+    }
+};