Merge branch 'develop' into hotfix/#1732

XiaoMi · May 17, 2021 · 23d77d2 · 23d77d2
2 parents 1487a0f + b2a755b
commit 23d77d2
Show file tree

Hide file tree

Showing 6 changed files with 53 additions and 34 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -5,6 +5,8 @@
 - 优化 `Select` onChang 回调方法中，获取全部选项详细内容 [#1726](https://github.com/XiaoMi/hiui/issues/1726)
 - 修复 `Select` disabled 情况下，输入框仍能删除选项问题 [#1707](https://github.com/XiaoMi/hiui/issues/1707)
 - 修复 `Table` 组件表头分组中使用 fixedToColumn 属性导致表头错乱 [#1732](https://github.com/XiaoMi/hiui/issues/1732)
+- 优化 `Form` 组件允许 FormItem 中的表单类组件设置 value [#1741](https://github.com/XiaoMi/hiui/issues/1741)
+- 修复 `Upload` 组件 onRemove 回调 api 导致外部引用闭包的问题 [#1739](https://github.com/XiaoMi/hiui/issues/1739)
 
 # 3.6.1
 - 修复部分组件 'regeneratorRuntime is not defined' 问题 [#1719](https://github.com/XiaoMi/hiui/issues/1719)

diff --git a/components/form/Form.js b/components/form/Form.js
@@ -245,7 +245,7 @@ const InternalForm = (props) => {
           const { field, value } = item
           values[field] = value
         })
-      return values
+      return transformValues(values, fields)
     },
     [fields, _Immutable]
   )

diff --git a/components/form/Item.js b/components/form/Item.js
@@ -52,8 +52,9 @@ const FormItem = (props) => {
       form: { colon }
     }
   } = formProps || {}
+  const _propsValue = children && children.props ? children.props[valuePropName] : ''
   // 初始化FormItem的内容
-  const [value, setValue] = useState('')
+  const [value, setValue] = useState(_propsValue)
   const [error, setError] = useState('')
 
   const getItemfield = useCallback(() => {
@@ -69,6 +70,14 @@ const FormItem = (props) => {
   useEffect(() => {
     setField(getItemfield())
   }, [propsField, name])
+  // 兼容 2.x value
+  useEffect(() => {
+    if (typeof _propsValue !== 'undefined') {
+      setValue(_propsValue)
+      updateField(_propsValue)
+    }
+  }, [_propsValue, field])
+
   // 更新
   const updateField = (_value, triggerType) => {
     const childrenFiled = {
@@ -265,7 +274,7 @@ const FormItem = (props) => {
       return item.field === _field
     })
     if (_field && !isExist) {
-      _value = initialValues && initialValues[field] ? initialValues[_field] : ''
+      _value = initialValues && initialValues[field] ? initialValues[_field] : _value
       if (_type === 'list' && listItemValue) {
         _value = typeof listItemValue[name] !== 'undefined' ? listItemValue[name] : listItemValue
       }
@@ -291,8 +300,8 @@ const FormItem = (props) => {
       if (HIUI[component]) {
         const HIUIComponent = HIUI[component]
         return React.createElement(HIUIComponent, {
-          ...componentProps,
           [valuePropName]: _value,
+          ...componentProps,
           onChange: (e, ...args) => {
             setEvent('onChange', HIUIComponent, componentProps, e, ...args)
           },
@@ -307,11 +316,12 @@ const FormItem = (props) => {
     if (!children) {
       return null
     }
-
+    const propChild = children ? children.props : {}
     return Array.isArray(children) || !React.isValidElement(children)
       ? children
       : React.cloneElement(children, {
           [valuePropName]: _value,
+          ...propChild,
           onChange: (e, ...args) => {
             setEvent('onChange', children, '', e, ...args)
           },

diff --git a/components/select/style/index.scss b/components/select/style/index.scss
@@ -16,10 +16,4 @@
   &__hide {
     display: none;
   }
-
-  &:focus {
-    .hi-select__input {
-      border-color: use-color('primary');
-    }
-  }
 }
diff --git a/components/select/style/select-input.scss b/components/select/style/select-input.scss
@@ -42,6 +42,16 @@
     input {
       cursor: not-allowed;
     }
+
+    &.multiple-values .hi-select__input-items--left {
+      color: use-color('gray-50');
+    }
+
+    .hi-select__input--item {
+      .hi-select__input--item__remove {
+        cursor: not-allowed;
+      }
+    }
   }
 
   .hi-icon {

diff --git a/components/upload/hooks/useUpload.js b/components/upload/hooks/useUpload.js
@@ -30,30 +30,33 @@ const useUpload = ({
     }
   }, [fileList])
 
-  const deleteFile = useCallback((file, index) => {
-    if (file.abort) {
-      file.abort()
-    }
-    let result = true
-    if (onRemove) {
-      result = onRemove(file, [...fileListRef.current], index)
-    }
-    if (!fileList) {
-      const newFileList = [...fileListRef.current]
-      newFileList.splice(index, 1)
-      if (result === true) {
-        fileListRef.current = newFileList
-        updateFileList(fileListRef.current)
-      } else if (result && typeof result.then === 'function') {
-        result.then((res) => {
-          if (res === true) {
-            fileListRef.current = newFileList
-            updateFileList(fileListRef.current)
-          }
-        })
+  const deleteFile = useCallback(
+    (file, index) => {
+      if (file.abort) {
+        file.abort()
       }
-    }
-  }, [])
+      let result = true
+      if (onRemove) {
+        result = onRemove(file, [...fileListRef.current], index)
+      }
+      if (!fileList) {
+        const newFileList = [...fileListRef.current]
+        newFileList.splice(index, 1)
+        if (result === true) {
+          fileListRef.current = newFileList
+          updateFileList(fileListRef.current)
+        } else if (result && typeof result.then === 'function') {
+          result.then((res) => {
+            if (res === true) {
+              fileListRef.current = newFileList
+              updateFileList(fileListRef.current)
+            }
+          })
+        }
+      }
+    },
+    [onRemove]
+  )
 
   const onSuccess = (file, res) => {
     const newFileList = [...fileListRef.current]