@nutui/nutui-react-taro 3.0.0-beta.0 → 3.0.0-beta.10

package/dist/cjs/packages/calendaritem/calendaritem.js

@@ -54,7 +54,7 @@ var defaultProps = (0, _object_spread_props._)((0, _object_spread._)({}, _typing
 });
 var CalendarItem = /*#__PURE__*/ _react.default.forwardRef(function(props, ref) {
     var locale = (0, _configprovider.useConfig)().locale;
-    var _$_object_spread = (0, _object_spread._)({}, defaultProps, props), style = _$_object_spread.style, className = _$_object_spread.className, children = _$_object_spread.children, popup = _$_object_spread.popup, type = _$_object_spread.type, autoBackfill = _$_object_spread.autoBackfill, title = _$_object_spread.title, defaultValue = _$_object_spread.defaultValue, startDate = _$_object_spread.startDate, endDate = _$_object_spread.endDate, showToday = _$_object_spread.showToday, startText = _$_object_spread.startText, endText = _$_object_spread.endText, confirmText = _$_object_spread.confirmText, showTitle = _$_object_spread.showTitle, showSubTitle = _$_object_spread.showSubTitle, scrollAnimation = _$_object_spread.scrollAnimation, firstDayOfWeek = _$_object_spread.firstDayOfWeek, disableDate = _$_object_spread.disableDate, renderHeaderButtons = _$_object_spread.renderHeaderButtons, renderDay = _$_object_spread.renderDay, renderDayTop = _$_object_spread.renderDayTop, renderDayBottom = _$_object_spread.renderDayBottom, value = _$_object_spread.value, onConfirm = _$_object_spread.onConfirm, onUpdate = _$_object_spread.onUpdate, onDayClick = _$_object_spread.onDayClick, onPageChange = _$_object_spread.onPageChange;
+    var _$_object_spread = (0, _object_spread._)({}, defaultProps, props), style = _$_object_spread.style, className = _$_object_spread.className, children = _$_object_spread.children, popup = _$_object_spread.popup, type = _$_object_spread.type, autoBackfill = _$_object_spread.autoBackfill, title = _$_object_spread.title, defaultValue = _$_object_spread.defaultValue, startDate = _$_object_spread.startDate, endDate = _$_object_spread.endDate, showToday = _$_object_spread.showToday, startText = _$_object_spread.startText, endText = _$_object_spread.endText, confirmText = _$_object_spread.confirmText, showTitle = _$_object_spread.showTitle, showSubTitle = _$_object_spread.showSubTitle, scrollAnimation = _$_object_spread.scrollAnimation, firstDayOfWeek = _$_object_spread.firstDayOfWeek, disableDate = _$_object_spread.disableDate, renderHeaderButtons = _$_object_spread.renderHeaderButtons, renderDay = _$_object_spread.renderDay, renderDayTop = _$_object_spread.renderDayTop, renderDayBottom = _$_object_spread.renderDayBottom, renderBottomButton = _$_object_spread.renderBottomButton, value = _$_object_spread.value, onConfirm = _$_object_spread.onConfirm, onUpdate = _$_object_spread.onUpdate, onDayClick = _$_object_spread.onDayClick, onPageChange = _$_object_spread.onPageChange;
     var weekdays = locale.calendaritem.weekdays;
     var weeks = (0, _to_consumable_array._)(weekdays.slice(firstDayOfWeek, 7)).concat((0, _to_consumable_array._)(weekdays.slice(0, firstDayOfWeek)));
     var monthTitle = locale.calendaritem.monthTitle;
@@ -291,6 +291,7 @@ var CalendarItem = /*#__PURE__*/ _react.default.forwardRef(function(props, ref)
                     type: 'curr'
                 }, monthsData[current.current], true);
             } else if (type === 'multiple') {
+                ;
                 (0, _to_consumable_array._)(currentDate).forEach(function(item) {
                     var dateArr = (0, _utils.splitDate)(item);
                     var currentIndex = current.current;
@@ -349,10 +350,14 @@ var CalendarItem = /*#__PURE__*/ _react.default.forwardRef(function(props, ref)
     };
     (0, _react.useEffect)(function() {
         setCurrentDate(resetDefaultValue() || []);
-        popup && resetRender();
     }, [
         defaultValue
     ]);
+    (0, _react.useEffect)(function() {
+        popup && resetRender();
+    }, [
+        currentDate
+    ]);
     // 暴露出的API
     var scrollToDate = function scrollToDate(date) {
         if (_date.Utils.compareDate(date, propStartDate)) {
@@ -397,6 +402,7 @@ var CalendarItem = /*#__PURE__*/ _react.default.forwardRef(function(props, ref)
         var scrollTop = e.target.scrollTop;
         _taro.default.getEnv() === 'WEB' && setScrollTop(scrollTop);
         var current = Math.floor(scrollTop / avgHeight);
+        if (current < 0) return;
         if (!monthsData[current + 1]) return;
         var nextTop = monthsData[current + 1].scrollTop;
         var nextHeight = monthsData[current + 1].cssHeight;
@@ -473,13 +479,16 @@ var CalendarItem = /*#__PURE__*/ _react.default.forwardRef(function(props, ref)
                 if (isFirst) {
                     state.currDateArray.push((0, _to_consumable_array._)(days));
                 } else if (hasIndex !== '') {
+                    ;
                     currentDate.splice(hasIndex, 1);
                     state.currDateArray.splice(hasIndex, 1);
                 } else {
+                    ;
                     currentDate.push(days[3]);
                     state.currDateArray.push((0, _to_consumable_array._)(days));
                 }
             } else {
+                ;
                 currentDate.push(days[3]);
                 state.currDateArray = [
                     (0, _to_consumable_array._)(days)
@@ -568,19 +577,19 @@ var CalendarItem = /*#__PURE__*/ _react.default.forwardRef(function(props, ref)
         return currentDate.length >= 2 && (type === 'range' || type === 'week') && day.type === 'active' && (0, _utils.isEnd)((0, _utils.getCurrDate)(day, month), currentDate);
     };
     var renderHeader = function renderHeader() {
-        return /*#__PURE__*/ _react.default.createElement("div", {
+        return /*#__PURE__*/ _react.default.createElement(_components.View, {
             className: headerClasses
-        }, showTitle && /*#__PURE__*/ _react.default.createElement("div", {
+        }, showTitle && /*#__PURE__*/ _react.default.createElement(_components.View, {
             className: "".concat(classPrefix, "-title")
-        }, title || locale.calendaritem.title), renderHeaderButtons && /*#__PURE__*/ _react.default.createElement("div", {
+        }, title || locale.calendaritem.title), renderHeaderButtons && /*#__PURE__*/ _react.default.createElement(_components.View, {
             className: "".concat(classPrefix, "-header-buttons")
-        }, renderHeaderButtons()), showSubTitle && /*#__PURE__*/ _react.default.createElement("div", {
+        }, renderHeaderButtons()), showSubTitle && /*#__PURE__*/ _react.default.createElement(_components.View, {
             className: "".concat(classPrefix, "-sub-title")
-        }, yearMonthTitle), /*#__PURE__*/ _react.default.createElement("div", {
+        }, yearMonthTitle), /*#__PURE__*/ _react.default.createElement(_components.View, {
             className: "".concat(classPrefix, "-weeks"),
             ref: weeksPanel
         }, weeks.map(function(item) {
-            return /*#__PURE__*/ _react.default.createElement("div", {
+            return /*#__PURE__*/ _react.default.createElement(_components.View, {
                 className: "".concat(classPrefix, "-week-item"),
                 key: item
             }, item);
@@ -595,25 +604,25 @@ var CalendarItem = /*#__PURE__*/ _react.default.forwardRef(function(props, ref)
             className: "".concat(classPrefix, "-content"),
             onScroll: monthsViewScroll,
             ref: monthsRef
-        }, /*#__PURE__*/ _react.default.createElement("div", {
+        }, /*#__PURE__*/ _react.default.createElement(_components.View, {
             className: "".concat(classPrefix, "-pannel"),
             ref: monthsPanel
-        }, /*#__PURE__*/ _react.default.createElement("div", {
+        }, /*#__PURE__*/ _react.default.createElement(_components.View, {
             className: "viewArea",
             ref: viewAreaRef,
             style: {
                 transform: "translateY(".concat(translateY, "px)")
             }
         }, monthsData.slice(monthDefaultRange[0], monthDefaultRange[1]).map(function(month, key) {
-            return /*#__PURE__*/ _react.default.createElement("div", {
+            return /*#__PURE__*/ _react.default.createElement(_components.View, {
                 className: "".concat(classPrefix, "-month"),
                 key: key
-            }, /*#__PURE__*/ _react.default.createElement("div", {
+            }, /*#__PURE__*/ _react.default.createElement(_components.View, {
                 className: "".concat(classPrefix, "-month-title")
-            }, month.title), /*#__PURE__*/ _react.default.createElement("div", {
+            }, month.title), /*#__PURE__*/ _react.default.createElement(_components.View, {
                 className: "".concat(classPrefix, "-days")
             }, month.monthData.map(function(day, i) {
-                return /*#__PURE__*/ _react.default.createElement("div", {
+                return /*#__PURE__*/ _react.default.createElement(_components.View, {
                     className: [
                         "".concat(classPrefix, "-day"),
                         getClasses(day, month)
@@ -622,33 +631,35 @@ var CalendarItem = /*#__PURE__*/ _react.default.forwardRef(function(props, ref)
                         chooseDay(day, month);
                     },
                     key: i
-                }, /*#__PURE__*/ _react.default.createElement("div", {
+                }, /*#__PURE__*/ _react.default.createElement(_components.View, {
                     className: "".concat(classPrefix, "-day-day")
-                }, renderDay ? renderDay(day) : day.day), !isStartTip(day, month) && renderDayTop && /*#__PURE__*/ _react.default.createElement("div", {
+                }, renderDay ? renderDay(day) : day.day), !isStartTip(day, month) && renderDayTop && /*#__PURE__*/ _react.default.createElement(_components.View, {
                     className: "".concat(classPrefix, "-day-info-top")
-                }, renderDayTop(day)), !isStartTip(day, month) && !isEndTip(day, month) && renderDayBottom && /*#__PURE__*/ _react.default.createElement("div", {
+                }, renderDayTop(day)), !isStartTip(day, month) && !isEndTip(day, month) && renderDayBottom && /*#__PURE__*/ _react.default.createElement(_components.View, {
                     className: "".concat(classPrefix, "-day-info-bottom")
-                }, renderDayBottom(day)), !isStartTip(day, month) && !isEndTip(day, month) && !renderDayBottom && showToday && (0, _utils.isCurrDay)(month, day.day) && /*#__PURE__*/ _react.default.createElement("div", {
+                }, renderDayBottom(day)), !isStartTip(day, month) && !isEndTip(day, month) && !renderDayBottom && showToday && (0, _utils.isCurrDay)(month, day.day) && /*#__PURE__*/ _react.default.createElement(_components.View, {
                     className: "".concat(classPrefix, "-day-info-curr")
-                }, locale.calendaritem.today), isStartTip(day, month) && /*#__PURE__*/ _react.default.createElement("div", {
+                }, locale.calendaritem.today), isStartTip(day, month) && /*#__PURE__*/ _react.default.createElement(_components.View, {
                     className: "".concat(classPrefix, "-day-info ").concat((0, _utils.isStartAndEnd)(currentDate) ? "".concat(classPrefix, "-day-info-top") : '')
-                }, startText || locale.calendaritem.start), isEndTip(day, month) && /*#__PURE__*/ _react.default.createElement("div", {
+                }, startText || locale.calendaritem.start), isEndTip(day, month) && /*#__PURE__*/ _react.default.createElement(_components.View, {
                     className: "".concat(classPrefix, "-day-info")
                 }, endText || locale.calendaritem.end));
             })));
         }))));
     };
     var renderFooter = function renderFooter() {
-        return /*#__PURE__*/ _react.default.createElement("div", {
+        return /*#__PURE__*/ _react.default.createElement(_components.View, {
             className: "nut-calendar-footer"
-        }, children, /*#__PURE__*/ _react.default.createElement("div", {
+        }, children, /*#__PURE__*/ _react.default.createElement(_components.View, {
             className: "calendar-confirm-btn",
             onClick: confirm
-        }, confirmText || locale.confirm));
+        }, renderBottomButton ? renderBottomButton() : /*#__PURE__*/ _react.default.createElement(_components.View, {
+            className: "calendar-confirm-btn"
+        }, confirmText || locale.confirm)));
     };
-    return /*#__PURE__*/ _react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/ _react.default.createElement("div", {
+    return /*#__PURE__*/ _react.default.createElement(_components.View, {
         className: classes,
         style: style
-    }, renderHeader(), renderContent(), popup && !autoBackfill ? renderFooter() : ''));
+    }, renderHeader(), renderContent(), popup && !autoBackfill ? renderFooter() : '');
 });
 CalendarItem.displayName = 'NutCalendarItem';

package/dist/cjs/packages/calendaritem/style/style.css

@@ -0,0 +1,4 @@
+/* #ifdef harmony */
+/* #endif */
+/* #ifndef harmony */
+/* #endif */

package/dist/cjs/packages/card/card.js

@@ -17,6 +17,7 @@ var _components = require("@tarojs/components");
 var _classnames = /*#__PURE__*/ _interop_require_default._(require("classnames"));
 var _index = /*#__PURE__*/ _interop_require_default._(require("../price/index"));
 var _index1 = /*#__PURE__*/ _interop_require_default._(require("../tag/index"));
+var _index2 = /*#__PURE__*/ _interop_require_default._(require("../image/index"));
 var _typings = require("../../utils/typings");
 var defaultProps = (0, _object_spread_props._)((0, _object_spread._)({}, _typings.ComponentDefaults), {
     src: '',
@@ -53,9 +54,8 @@ var Card = function Card(props) {
         style: style
     }, rest), /*#__PURE__*/ _react.default.createElement(_components.View, {
         className: "".concat(classPrefix, "-left")
-    }, /*#__PURE__*/ _react.default.createElement("img", {
-        src: src,
-        alt: ""
+    }, /*#__PURE__*/ _react.default.createElement(_index2.default, {
+        src: src
     })), /*#__PURE__*/ _react.default.createElement(_components.View, {
         className: "".concat(classPrefix, "-right")
     }, /*#__PURE__*/ _react.default.createElement(_components.View, {

package/dist/cjs/packages/card/style/card.scss

@@ -37,28 +37,13 @@
       line-height: 18px;
       margin-top: 9px;
 
-      .nut-price {
-        .nut-price-big {
-          font-size: 18px;
-        }
-
-        .nut-price-symbol,
-        .nut-price-point,
-        .nut-price-small {
-          font-size: 12px;
-        }
-      }
-
       &-origin {
         &.nut-price {
           margin-left: 2px;
-          color: #d2a448;
-
-          .nut-price-big,
           .nut-price-symbol,
-          .nut-price-point,
-          .nut-price-small {
-            font-size: 12px;
+          .nut-price-integer,
+          .nut-price-decimal {
+            color: #d2a448;
           }
         }
       }

package/dist/cjs/packages/card/style/style.css

@@ -1,49 +1,72 @@
+/* #ifdef harmony */
+/* #endif */
+/* #ifndef harmony */
+/* #endif */
 .nut-price {
   direction: ltr;
-  font-size: var(--nutui-font-size-4, 16px);
+  font-size: var(--nutui-font-size-l, 16px);
   display: flex;
   flex-direction: row;
   align-items: baseline;
 }
 .nut-price-symbol, .nut-price-integer, .nut-price-decimal {
-  color: var(--nutui-color-primary, #ff0f23);
+  color: var(--nutui-price-color, var(--nutui-color-text-help));
+  font-family: "JD";
+  line-height: 1;
+}
+.nut-price-darkgray .nut-price-symbol, .nut-price-darkgray .nut-price-integer, .nut-price-darkgray .nut-price-decimal {
+  font-family: "JD-Bold";
+  color: var(--nutui-price-darkgray-color, var(--nutui-gray-7));
+}
+.nut-price-primary .nut-price-symbol, .nut-price-primary .nut-price-integer, .nut-price-primary .nut-price-decimal {
+  font-family: "JD-Bold";
+  color: var(--nutui-price-color, var(--nutui-brand-6));
 }
 .nut-price-symbol {
-  font-size: var(--nutui-price-symbol-medium-size, 14px);
-  padding-right: var(--nutui-price-symbol-padding-right, 1px);
+  padding-right: var(--nutui-price-symbol-padding-right, 0px);
+}
+.nut-price-symbol-xlarge {
+  font-size: var(--nutui-price-symbol-xlarge-size, 12px);
 }
 .nut-price-symbol-large {
-  font-size: var(--nutui-price-symbol-big-size, 18px);
+  font-size: var(--nutui-price-symbol-large-size, 12px);
+}
+.nut-price-symbol-normal {
+  font-size: var(--nutui-price-symbol-normal-size, 12px);
 }
 .nut-price-symbol-small {
-  font-size: var(--nutui-price-symbol-small-size, 10px);
+  font-size: var(--nutui-price-symbol-small-size, 12px);
 }
 .nut-price-symbol-rtl {
   padding-right: 0;
-  padding-left: var(--nutui-price-symbol-padding-right, 1px);
+  padding-left: var(--nutui-price-symbol-padding-right, 0px);
 }
-.nut-price-integer {
-  font-size: var(--nutui-price-integer-medium-size, 16px);
+.nut-price-integer-xlarge {
+  font-size: var(--nutui-price-integer-xlarge-size, 24px);
 }
 .nut-price-integer-large {
-  font-size: var(--nutui-price-integer-big-size, 24px);
+  font-size: var(--nutui-price-integer-large-size, 18px);
+}
+.nut-price-integer-normal {
+  font-size: var(--nutui-price-integer-normal-size, 16px);
 }
 .nut-price-integer-small {
   font-size: var(--nutui-price-integer-small-size, 12px);
 }
-.nut-price-decimal {
-  font-size: var(--nutui-price-decimal-medium-size, 14px);
+.nut-price-decimal-xlarge {
+  font-size: var(--nutui-price-decimal-xlarge-size, 12px);
 }
 .nut-price-decimal-large {
-  font-size: var(--nutui-price-decimal-big-size, 18px);
+  font-size: var(--nutui-price-decimal-large-size, 12px);
+}
+.nut-price-decimal-normal {
+  font-size: var(--nutui-price-decimal-normal-size, 12px);
 }
 .nut-price-decimal-small {
-  font-size: var(--nutui-price-decimal-small-size, 10px);
+  font-size: var(--nutui-price-decimal-small-size, 12px);
 }
 .nut-price-line {
-  text-decoration: line-through var(--nutui-price-line-color, var(--nutui-black-3, rgba(0, 0, 0, 0.06)));
-  font-size: var(--nutui-price-line-font-size, 12px);
-  color: var(--nutui-price-line-color, var(--nutui-black-3, rgba(0, 0, 0, 0.06)));
+  text-decoration: line-through var(--nutui-price-line-color, var(--nutui-color-text-help));
 }
 
 .nut-tag {
@@ -52,7 +75,7 @@
   flex-direction: row;
   justify-content: center;
   align-items: center;
-  font-size: var(--nutui-tag-font-size, var(--nutui-font-size-1, 10px));
+  font-size: var(--nutui-tag-font-size, var(--nutui-font-size-xxs, 10px));
   border-radius: var(--nutui-tag-border-radius, 2px);
   height: var(--nutui-tag-height, 14px);
   color: var(--nutui-tag-color, #ffffff);
@@ -61,31 +84,32 @@
 .nut-tag .nut-icon {
   vertical-align: middle;
   margin-left: 4px;
+  color: var(--nutui-tag-color, #ffffff);
 }
 .nut-tag-text {
-  font-size: var(--nutui-tag-font-size, var(--nutui-font-size-1, 10px));
+  font-size: var(--nutui-tag-font-size, var(--nutui-font-size-xxs, 10px));
   color: var(--nutui-tag-color, #ffffff);
 }
 .nut-tag-text-plain {
-  color: var(--nutui-gray-7, #1a1a1a);
+  color: var(--nutui-gray-7);
 }
 .nut-tag-default {
-  background: var(--nutui-tag-background-color, var(--nutui-gray-7, #1a1a1a));
+  background: var(--nutui-tag-background-color, var(--nutui-gray-7));
 }
 .nut-tag-primary {
   background: #fa2c19;
 }
 .nut-tag-info {
-  background: var(--nutui-tag-info-background-color, var(--nutui-color-info, #1988fa));
+  background: var(--nutui-tag-info-background-color, var(--nutui-color-info, #0073ff));
 }
 .nut-tag-success {
   background: var(--nutui-tag-success-background-color, #4fc08d);
 }
 .nut-tag-danger {
-  background: var(--nutui-tag-danger-background-color, var(--nutui-color-danger, #ff0f23));
+  background: var(--nutui-tag-danger-background-color, var(--nutui-red-2));
 }
 .nut-tag-warning {
-  background: var(--nutui-tag-warning-background-color, var(--nutui-color-warning, #c47600));
+  background: var(--nutui-tag-warning-background-color, var(--nutui-yellow-2));
 }
 .nut-tag-round {
   border-radius: var(--nutui-tag-round-border-radius, 8px);
@@ -100,11 +124,13 @@
   display: inline-flex;
   align-items: center;
   justify-content: center;
-  font-size: var(--nutui-tag-font-size, var(--nutui-font-size-1, 10px));
+  font-size: var(--nutui-tag-font-size, var(--nutui-font-size-xxs, 10px));
+  color: var(--nutui-tag-color, #ffffff);
+  margin-left: 4px;
 }
 .nut-tag-plain {
   background-color: #fff;
-  border: var(--nutui-tag-border-width, 1px) solid var(--nutui-gray-7, #1a1a1a);
+  border: var(--nutui-tag-border-width, 1px) solid var(--nutui-gray-7);
 }
 
 [dir=rtl] .nut-tag .nut-icon,
@@ -142,7 +168,7 @@
   word-break: break-all;
   line-height: 1.5;
   font-size: 14px;
-  color: var(--nutui-gray-7, #1a1a1a);
+  color: var(--nutui-gray-7);
 }
 .nut-card-right-price {
   display: flex;
@@ -151,23 +177,13 @@
   line-height: 18px;
   margin-top: 9px;
 }
-.nut-card-right-price .nut-price .nut-price-big {
-  font-size: 18px;
-}
-.nut-card-right-price .nut-price .nut-price-symbol,
-.nut-card-right-price .nut-price .nut-price-point,
-.nut-card-right-price .nut-price .nut-price-small {
-  font-size: 12px;
-}
 .nut-card-right-price-origin.nut-price {
   margin-left: 2px;
-  color: #d2a448;
 }
-.nut-card-right-price-origin.nut-price .nut-price-big,
 .nut-card-right-price-origin.nut-price .nut-price-symbol,
-.nut-card-right-price-origin.nut-price .nut-price-point,
-.nut-card-right-price-origin.nut-price .nut-price-small {
-  font-size: 12px;
+.nut-card-right-price-origin.nut-price .nut-price-integer,
+.nut-card-right-price-origin.nut-price .nut-price-decimal {
+  color: #d2a448;
 }
 .nut-card-right-other {
   display: flex;
@@ -177,7 +193,7 @@
 .nut-card-right-other .nut-tag {
   padding: 0 2px;
   margin-right: 5px;
-  font-size: var(--nutui-font-size-1, 10px);
+  font-size: var(--nutui-font-size-xs, 11px);
 }
 .nut-card-right-shop {
   display: flex;
@@ -186,7 +202,7 @@
 }
 .nut-card-right-shop-name {
   line-height: 1.5;
-  color: var(--nutui-gray-6, #505259);
+  color: var(--nutui-gray-6);
   font-size: 12px;
   padding-top: 4px;
 }

package/dist/cjs/packages/cascader/cascader.js

@@ -25,6 +25,7 @@ var _tabs = require("../tabs/tabs");
 var _utils = /*#__PURE__*/ _interop_require_wildcard._(require("./utils"));
 var _typings = require("../../utils/typings");
 var _usepropsvalue = require("../../utils/use-props-value");
+var _configprovider = require("../configprovider/configprovider");
 var defaultProps = (0, _object_spread_props._)((0, _object_spread._)({}, _typings.ComponentDefaults), {
     activeColor: '',
     activeIcon: 'checklist',
@@ -46,6 +47,7 @@ var defaultProps = (0, _object_spread_props._)((0, _object_spread._)({}, _typing
     onPathChange: function onPathChange() {}
 });
 var InternalCascader = function InternalCascader(props, ref) {
+    var locale = (0, _configprovider.useConfig)().locale;
     var _$_object_spread = (0, _object_spread._)({}, defaultProps, props), className = _$_object_spread.className, style = _$_object_spread.style, activeColor = _$_object_spread.activeColor, activeIcon = _$_object_spread.activeIcon, popup = _$_object_spread.popup, _object_spread_popupProps = _$_object_spread.popupProps, popupProps = _object_spread_popupProps === void 0 ? {} : _object_spread_popupProps, visible = _$_object_spread.visible, options = _$_object_spread.options, value = _$_object_spread.value, defaultValue = _$_object_spread.defaultValue, optionKey = _$_object_spread.optionKey, format = _$_object_spread.format, closeable = _$_object_spread.closeable, closeIconPosition = _$_object_spread.closeIconPosition, closeIcon = _$_object_spread.closeIcon, lazy = _$_object_spread.lazy, title = _$_object_spread.title, left = _$_object_spread.left, onLoad = _$_object_spread.onLoad, onClose = _$_object_spread.onClose, onChange = _$_object_spread.onChange, onPathChange = _$_object_spread.onPathChange;
     var _useState = (0, _sliced_to_array._)((0, _react.useState)('c1'), 2), tabvalue = _useState[0], setTabvalue = _useState[1];
     var _useState1 = (0, _sliced_to_array._)((0, _react.useState)([]), 2), optionsData = _useState1[0], setOptionsData = _useState1[1];
@@ -102,7 +104,12 @@ var InternalCascader = function InternalCascader(props, ref) {
         options,
         format
     ]);
-    var initData = function() {
+    (0, _react.useEffect)(function() {
+        syncValue();
+    }, [
+        value
+    ]);
+    var initData = /*#__PURE__*/ function() {
         var _ref = (0, _async_to_generator._)(function() {
             return (0, _ts_generator._)(this, function(_state) {
                 switch(_state.label){
@@ -156,14 +163,17 @@ var InternalCascader = function InternalCascader(props, ref) {
         };
     }();
     // 处理有默认值时的数据
-    var syncValue = function() {
+    var syncValue = /*#__PURE__*/ function() {
         var _ref = (0, _async_to_generator._)(function() {
             var currentValue, needToSync, parent, last, pathNodes;
             return (0, _ts_generator._)(this, function(_state) {
                 switch(_state.label){
                     case 0:
                         currentValue = innerValue;
-                        if (currentValue === undefined || currentValue !== defaultValue || !state.tree.nodes.length) {
+                        if (currentValue === undefined || ![
+                            defaultValue,
+                            value
+                        ].includes(currentValue) || !state.tree.nodes.length) {
                             return [
                                 2
                             ];
@@ -193,7 +203,7 @@ var InternalCascader = function InternalCascader(props, ref) {
                         state.initLoading = true;
                         return [
                             4,
-                            currentValue.slice(1).reduce(function() {
+                            currentValue.slice(1).reduce(/*#__PURE__*/ function() {
                                 var _ref = (0, _async_to_generator._)(function(p, value) {
                                     var _parent_children, parent, node;
                                     return (0, _ts_generator._)(this, function(_state) {
@@ -240,7 +250,10 @@ var InternalCascader = function InternalCascader(props, ref) {
                         state.initLoading = false;
                         _state.label = 3;
                     case 3:
-                        if (needToSync.length && currentValue === defaultValue) {
+                        if (needToSync.length && [
+                            defaultValue,
+                            value
+                        ].includes(currentValue)) {
                             pathNodes = state.tree.getPathNodesByValue(needToSync);
                             pathNodes.forEach(function(node, index) {
                                 state.tabsCursor = index;
@@ -258,7 +271,7 @@ var InternalCascader = function InternalCascader(props, ref) {
             return _ref.apply(this, arguments);
         };
     }();
-    var invokeLazyLoad = function() {
+    var invokeLazyLoad = /*#__PURE__*/ function() {
         var _ref = (0, _async_to_generator._)(function(node) {
             var parent, lazyLoadPromise, nodes;
             return (0, _ts_generator._)(this, function(_state) {
@@ -322,7 +335,7 @@ var InternalCascader = function InternalCascader(props, ref) {
         close();
     };
     /* type: 是否是静默模式，是的话不触发事件
-  tabsCursor: tab的索引 */ var chooseItem = function() {
+  tabsCursor: tab的索引 */ var chooseItem = /*#__PURE__*/ function() {
         var _ref = (0, _async_to_generator._)(function(node, type) {
             var pathNodes, optionParams, level, pathNodes1, optionParams1;
             return (0, _ts_generator._)(this, function(_state) {
@@ -422,13 +435,13 @@ var InternalCascader = function InternalCascader(props, ref) {
                 if (/*#__PURE__*/ (0, _react.isValidElement)(activeIcon)) {
                     return activeIcon;
                 }
-                return /*#__PURE__*/ _react.default.createElement(_iconsreacttaro.Checklist, {
+                return /*#__PURE__*/ _react.default.createElement(_iconsreacttaro.Check, {
                     className: "".concat(checked ? "".concat(classPrefix, "-icon-check") : '')
                 });
             }
             return null;
         };
-        return /*#__PURE__*/ _react.default.createElement("div", {
+        return /*#__PURE__*/ _react.default.createElement(_components.View, {
             style: {
                 color: checked ? activeColor : ''
             },
@@ -437,7 +450,7 @@ var InternalCascader = function InternalCascader(props, ref) {
             onClick: function onClick() {
                 chooseItem(node, false);
             }
-        }, /*#__PURE__*/ _react.default.createElement("div", {
+        }, /*#__PURE__*/ _react.default.createElement(_components.View, {
             className: classesTitle
         }, node.text), node.loading ? /*#__PURE__*/ _react.default.createElement(_iconsreacttaro.Loading, {
             color: "#969799",
@@ -445,7 +458,7 @@ var InternalCascader = function InternalCascader(props, ref) {
         }) : renderIcon());
     };
     var renderTabs = function renderTabs() {
-        return /*#__PURE__*/ _react.default.createElement("div", {
+        return /*#__PURE__*/ _react.default.createElement(_components.View, {
             className: "".concat(classPrefix, " ").concat(className),
             style: style
         }, /*#__PURE__*/ _react.default.createElement(_tabs.Tabs, {
@@ -453,7 +466,7 @@ var InternalCascader = function InternalCascader(props, ref) {
             title: function title() {
                 return optionsData.map(function(pane, index) {
                     var _pane_selectedNode, _pane_selectedNode1;
-                    return /*#__PURE__*/ _react.default.createElement("div", {
+                    return /*#__PURE__*/ _react.default.createElement(_components.View, {
                         onClick: function onClick() {
                             setTabvalue(pane.paneKey);
                             state.tabsCursor = index;
@@ -462,7 +475,7 @@ var InternalCascader = function InternalCascader(props, ref) {
                         key: pane.paneKey
                     }, /*#__PURE__*/ _react.default.createElement("span", {
                         className: "nut-tabs-titles-item-text"
-                    }, !state.initLoading && state.panes.length && (pane === null || pane === void 0 ? void 0 : (_pane_selectedNode = pane.selectedNode) === null || _pane_selectedNode === void 0 ? void 0 : _pane_selectedNode.text), !state.initLoading && state.panes.length && !(pane === null || pane === void 0 ? void 0 : (_pane_selectedNode1 = pane.selectedNode) === null || _pane_selectedNode1 === void 0 ? void 0 : _pane_selectedNode1.text) && '请选择', !(!state.initLoading && state.panes.length) && 'Loading...'), /*#__PURE__*/ _react.default.createElement("span", {
+                    }, !state.initLoading && state.panes.length && (pane === null || pane === void 0 ? void 0 : (_pane_selectedNode = pane.selectedNode) === null || _pane_selectedNode === void 0 ? void 0 : _pane_selectedNode.text), !state.initLoading && state.panes.length && !(pane === null || pane === void 0 ? void 0 : (_pane_selectedNode1 = pane.selectedNode) === null || _pane_selectedNode1 === void 0 ? void 0 : _pane_selectedNode1.text) && "".concat(locale.select), !(!state.initLoading && state.panes.length) && 'Loading...'), /*#__PURE__*/ _react.default.createElement("span", {
                         className: "nut-tabs-titles-item-line"
                     }));
                 });
@@ -478,16 +491,13 @@ var InternalCascader = function InternalCascader(props, ref) {
             }, (_pane_nodes = pane.nodes) === null || _pane_nodes === void 0 ? void 0 : _pane_nodes.map(function(node, index) {
                 return renderItem(pane, node, index);
             })));
-        }) : /*#__PURE__*/ _react.default.createElement(_tabs.Tabs.TabPane, null, /*#__PURE__*/ _react.default.createElement("div", {
+        }) : /*#__PURE__*/ _react.default.createElement(_tabs.Tabs.TabPane, null, /*#__PURE__*/ _react.default.createElement(_components.View, {
             className: classesPane
         }))));
     };
     return /*#__PURE__*/ _react.default.createElement(_react.default.Fragment, null, popup ? /*#__PURE__*/ _react.default.createElement(_popup.Popup, (0, _object_spread_props._)((0, _object_spread._)({}, popupProps), {
         visible: innerVisible,
         position: "bottom",
-        style: {
-            overflowY: 'hidden'
-        },
         round: true,
         closeIcon: closeIcon,
         closeable: closeable,