fix:Checkbox unable to trigger;fix:DatePicker click the icon triggers…

… the location incorrectly
XiaoMi · Dec 11, 2018 · 813a4ce · 813a4ce
1 parent d4a711b
commit 813a4ce
Show file tree

Hide file tree

Showing 3 changed files with 76 additions and 45 deletions.
diff --git a/components/checkbox/style/index.scss b/components/checkbox/style/index.scss
@@ -83,6 +83,7 @@
         left: 3px;
         right: 3px;
         top: 50%;
+        pointer-events: none;
       }
     }
   }

diff --git a/components/date-picker/BasePicker.js b/components/date-picker/BasePicker.js
@@ -258,6 +258,7 @@ class BasePicker extends Component {
       ? <span className={iconCls} onClick={this._clear.bind(this)} />
       : <span className={iconCls} onClick={(e) => {
         if (this.props.disabled) return
+        this.calcPanelPos(this.inputRoot.getBoundingClientRect())
         this.setState({showPanel: true, isFocus: true})
       }} />
   }

diff --git a/docs/zh-CN/date-picker.md b/docs/zh-CN/date-picker.md
@@ -18,52 +18,71 @@ constructor() {
 }
 render () {
   return (
-    <div>
-
-      <DatePicker
-        value={new Date}
-        onChange={(d) => {
-          console.log('value 为 Date 实例', DatePicker.format(d, 'YYYY-MM-DD E'))
-        }}
-      />
-      <DatePicker
-        value={1541755800052}
-        onChange={(d) => {
-          console.log(' value 为 Number(毫秒数)', DatePicker.format(d, 'YYYY-MM-DD E'))
-        }}
-      />
-      <DatePicker
-        value='2018-10-11'
-        onChange={(d) => {
-          console.log('value 为 时间字符串', DatePicker.format(d, 'YYYY-MM-DD E'))
-        }}
-      />
-      <DatePicker
-        format="YYYY-MM-DD HH:mm:SS"
-        onChange={(d) => {
-          console.log('没有 value 属性', DatePicker.format(d, 'YYYY-MM-DD E'))
-        }}
-      />
-      <DatePicker
-        value={null}
-        onChange={(d) => {
-          console.log('value 为 Null', DatePicker.format(d, 'YYYY-MM-DD E'))
-        }}
-      />
-      <DatePicker
-        value={undefined}
-        onChange={(d) => {
-          console.log('value 为 undefined', DatePicker.format(d, 'YYYY-MM-DD E'))
-        }}
-      />
-      <DatePicker
-        value=''
-        onChange={(d) => {
-          console.log('value 为 空字符串', DatePicker.format(d, 'YYYY-MM-DD E'))
-        }}
-      />
+    <div style={{display:'flex', flexWrap: 'wrap'}}>
+      <div>
+        <p>Date 实例:</p>
+        <DatePicker
+          value={new Date}
+          onChange={(d) => {
+            console.log('value 为 Date 实例', DatePicker.format(d, 'YYYY-MM-DD E'))
+          }}
+        />
+      </div>
 
-      <span style={{color: 'red', fontSize: '14px', cursor: 'pointer', marginLeft:'5px'}} onClick={() => {this.setState({date: new Date()})}}>重置</span>
+      <div>
+        <p>毫秒值(number):</p>
+        <DatePicker
+          value={1541755800052}
+          onChange={(d) => {
+            console.log(' value 为 Number(毫秒数)', DatePicker.format(d, 'YYYY-MM-DD E'))
+          }}
+        />
+      </div>
+      <div>
+        <p>时间字符串:</p>
+         <DatePicker
+          value='2018-10-11'
+          onChange={(d) => {
+            console.log('value 为 时间字符串', DatePicker.format(d, 'YYYY-MM-DD E'))
+          }}
+        />
+      </div>
+      <div>
+        <p>未传入 value:</p>
+        <DatePicker
+          format="YYYY-MM-DD HH:mm:SS"
+          onChange={(d) => {
+            console.log('没有 value 属性', DatePicker.format(d, 'YYYY-MM-DD E'))
+          }}
+        />
+      </div>
+      <div>
+        <p>null:</p>
+        <DatePicker
+          value={null}
+          onChange={(d) => {
+            console.log('value 为 Null', DatePicker.format(d, 'YYYY-MM-DD E'))
+          }}
+        />
+      </div>
+      <div>
+        <p>undefined:</p>
+        <DatePicker
+          value={undefined}
+          onChange={(d) => {
+            console.log('value 为 undefined', DatePicker.format(d, 'YYYY-MM-DD E'))
+          }}
+        />
+      </div>
+      <div>
+        <p>空字符串:</p>
+        <DatePicker
+          value=''
+          onChange={(d) => {
+            console.log('value 为 空字符串', DatePicker.format(d, 'YYYY-MM-DD E'))
+          }}
+        />
+      </div>
     </div>
   )
 }
@@ -96,11 +115,21 @@ render () {
 禁用日期
 
 ```js
+constructor () {
+  super()
+  this.state = {
+    date: new Date()
+  }
+}
 render () {
   return (
     <DatePicker
+      value={this.state.date}
       minDate={new Date()}
       maxDate={new Date(2019, 4, 28)}
+      onChange={(date) => {
+        this.setState({date})
+      }}
     />
   )
 }