fix: 组件2.0走查问题修复 (#1172)

* fix: 修改migrate文档 * fix: 调整文档 * fix: 修改v1升级到v2的兼容文档 * fix: 走查问题修复2.0 * fix: 同步demo.taro和demo相同
jdf2e · Jul 11, 2023 · bc3b354 · bc3b354
1 parent 06f5faf
commit bc3b354
Show file tree

Hide file tree

Showing 7 changed files with 72 additions and 59 deletions.
diff --git a/src/packages/circleprogress/demo.scss b/src/packages/circleprogress/demo.scss
@@ -12,6 +12,11 @@
     margin-right: 10px;
   }
 }
+.demo-btn {
+  .nut-button {
+    margin-right: 10px;
+  }
+}
 .demo__piece {
   display: flex;
   justify-content: center;

diff --git a/src/packages/circleprogress/demo.taro.tsx b/src/packages/circleprogress/demo.taro.tsx
@@ -1,7 +1,7 @@
 import React, { useState } from 'react'
 import Taro from '@tarojs/taro'
 import { useTranslate } from '@/sites/assets/locale/taro'
-import { Button, CircleProgress } from '@/packages/nutui.react.taro'
+import { Button, CircleProgress, Cell } from '@/packages/nutui.react.taro'
 import Header from '@/sites/components/header'
 import '@/packages/circleprogress/demo.scss'
 
@@ -83,55 +83,55 @@ const CircleProgressDemo = () => {
         } demo-circleprogress`}
       >
         <h2>{translated['84aa6bce']}</h2>
-        <div className="demo__piece">
+        <Cell style={{ justifyContent: 'center' }}>
           <CircleProgress percent={20} />
           <CircleProgress percent={60}>60%</CircleProgress>
-        </div>
+        </Cell>
 
         <h2>{translated['67eacf7f']}</h2>
-        <div className="demo__piece">
+        <Cell style={{ justifyContent: 'center' }}>
           <CircleProgress percent={50} strokeWidth={10} />
-        </div>
+        </Cell>
 
         <h2>{translated['3fee7d50']}</h2>
-        <div className="demo__piece">
+        <Cell style={{ justifyContent: 'center' }}>
           <CircleProgress percent={50} color="#fa2c19">
             50%
           </CircleProgress>
           <CircleProgress percent={100} color={gradientColor}>
             100%
           </CircleProgress>
-        </div>
+        </Cell>
 
         <h2>{translated.f4aa4b4c}</h2>
-        <div className="demo__piece">
+        <Cell style={{ justifyContent: 'center' }}>
           <CircleProgress percent={50} radius={60}>
             50%
           </CircleProgress>
-        </div>
+        </Cell>
 
         <h2>{translated['9daa2dd9']}</h2>
-        <div className="demo__piece">
+        <Cell style={{ justifyContent: 'center' }}>
           <CircleProgress percent={50} radius={60}>
             <div>3000</div>
             <div style={{ fontSize: '12px', color: 'var(--nutui-gray-2)' }}>
               步
             </div>
           </CircleProgress>
-        </div>
+        </Cell>
 
         <h2>{translated.c3e31425}</h2>
-        <div className="demo__piece">
+        <Cell style={{ justifyContent: 'center' }}>
           <CircleProgress percent={percent}>{percent}%</CircleProgress>
-        </div>
-        <div className="demo__btn">
+        </Cell>
+        <Cell className="demo__btn" style={{ justifyContent: 'center' }}>
           <Button type="primary" onClick={setReduceVal}>
             {translated['43c9f2ba']}
           </Button>
           <Button type="primary" onClick={setAddVal}>
             {translated.bce53fe7}
           </Button>
-        </div>
+        </Cell>
       </div>
     </>
   )

diff --git a/src/packages/circleprogress/demo.tsx b/src/packages/circleprogress/demo.tsx
@@ -1,6 +1,7 @@
 import React, { useState } from 'react'
 import { useTranslate } from '../../sites/assets/locale'
 import { CircleProgress } from './circleprogress'
+import Cell from '@/packages/cell'
 import Button from '@/packages/button'
 import './demo.scss'
 
@@ -69,64 +70,64 @@ const CircleProgressDemo = () => {
   }
 
   const gradientColor = {
-    '0%': 'var(--nutui-brand-color-start)',
-    '100%': 'var(--nutui-brand-color-end)',
+    '0%': '#FF5E5E',
+    '100%': '#FFA062',
   }
 
   return (
     <>
       <div className="demo">
         <h2>{translated['84aa6bce']}</h2>
-        <div className="demo__piece">
+        <Cell style={{ justifyContent: 'center' }}>
           <CircleProgress percent={20} />
           <CircleProgress percent={60}>60%</CircleProgress>
-        </div>
+        </Cell>
 
         <h2>{translated['67eacf7f']}</h2>
-        <div className="demo__piece">
+        <Cell style={{ justifyContent: 'center' }}>
           <CircleProgress percent={50} strokeWidth={2} />
           <CircleProgress percent={60} strokeWidth={10} background="#e5e9f2" />
-        </div>
+        </Cell>
 
         <h2>{translated['3fee7d50']}</h2>
-        <div className="demo__piece">
+        <Cell style={{ justifyContent: 'center' }}>
           <CircleProgress percent={50} color="var(--nutui-brand-link-color)">
             50%
           </CircleProgress>
           <CircleProgress percent={100} color={gradientColor}>
             100%
           </CircleProgress>
-        </div>
+        </Cell>
 
         <h2>{translated.f4aa4b4c}</h2>
-        <div className="demo__piece">
+        <Cell style={{ justifyContent: 'center' }}>
           <CircleProgress percent={50} radius={60}>
             50%
           </CircleProgress>
-        </div>
+        </Cell>
 
         <h2>{translated['9daa2dd9']}</h2>
-        <div className="demo__piece">
+        <Cell style={{ justifyContent: 'center' }}>
           <CircleProgress percent={50} radius={60}>
             <div>3000</div>
             <div style={{ fontSize: '12px', color: 'var(--nutui-gray-2)' }}>
               步
             </div>
           </CircleProgress>
-        </div>
+        </Cell>
 
         <h2>{translated.c3e31425}</h2>
-        <div className="demo__piece">
+        <Cell style={{ justifyContent: 'center' }}>
           <CircleProgress percent={percent}>{percent}%</CircleProgress>
-        </div>
-        <div className="demo__btn">
+        </Cell>
+        <Cell className="demo-btn" style={{ justifyContent: 'center' }}>
           <Button type="primary" onClick={setReduceVal}>
             {translated['43c9f2ba']}
           </Button>
           <Button type="primary" onClick={setAddVal}>
             {translated.bce53fe7}
           </Button>
-        </div>
+        </Cell>
       </div>
     </>
   )

diff --git a/src/packages/inputnumber/demo.scss b/src/packages/inputnumber/demo.scss
@@ -4,3 +4,31 @@
     --nutui-inputnumber-input-width: 60px;
   }
 }
+
+.custom-theme {
+  --nutui-inputnumber-button-width: 30px;
+  --nutui-inputnumber-button-height: 30px;
+  --nutui-inputnumber-button-border-radius: 2px;
+  --nutui-inputnumber-input-height: 30px;
+  --nutui-inputnumber-input-margin: 0 2px;
+  .nut-input-minus,
+  .nut-input-add {
+    background-color: var(--nutui-gray-4, #f4f4f4);
+  }
+}
+
+// nutuiInputnumberInputBackgroundColor: '#fff',
+
+.custom-theme-two {
+  --nutui-inputnumber-button-width: 30px;
+  --nutui-inputnumber-button-height: 30px;
+  --nutui-inputnumber-input-height: 30px;
+  --nutui-inputnumber-input-margin: 0 2px;
+  .nut-input-minus,
+  .nut-input-add {
+    background-color: var(--nutui-gray-4, #f4f4f4);
+  }
+  input {
+    background-color: var(--nutui-gray-6, #fff) !important;
+  }
+}
diff --git a/src/packages/inputnumber/demo.tsx b/src/packages/inputnumber/demo.tsx
@@ -1,7 +1,6 @@
 import React, { useState } from 'react'
 import { useTranslate } from '../../sites/assets/locale'
 import { InputNumber } from './inputnumber'
-import ConfigProvider from '@/packages/configprovider'
 import Cell from '@/packages/cell'
 import Toast from '@/packages/toast'
 import './demo.scss'
@@ -22,23 +21,6 @@ interface T {
   '7e2394be': string
 }
 
-const customTheme = {
-  nutuiInputnumberButtonWidth: '30px',
-  nutuiInputnumberButtonHeight: '30px',
-  nutuiInputnumberButtonBorderRadius: '2px',
-  nutuiInputnumberButtonBackgroundColor: `#f4f4f4`,
-  nutuiInputnumberInputHeight: '30px',
-  nutuiInputnumberInputMargin: '0 2px',
-}
-
-const customTheme2 = {
-  nutuiInputnumberButtonWidth: '30px',
-  nutuiInputnumberButtonHeight: '30px',
-  nutuiInputnumberButtonBackgroundColor: `#f4f4f4`,
-  nutuiInputnumberInputBackgroundColor: '#fff',
-  nutuiInputnumberInputMargin: '0 2px',
-}
-
 const InputNumberDemo = () => {
   const [translated] = useTranslate<T>({
     'zh-CN': {
@@ -135,16 +117,12 @@ const InputNumberDemo = () => {
 
         <h2>{translated.e7b2ce1g}</h2>
         <Cell>
-          <ConfigProvider theme={customTheme}>
-            <InputNumber defaultValue={1} />
-          </ConfigProvider>
+          <InputNumber className="custom-theme" defaultValue={1} />
         </Cell>
 
         <h2>{translated.e7b2ce1y}</h2>
         <Cell>
-          <ConfigProvider theme={customTheme2}>
-            <InputNumber defaultValue={1} />
-          </ConfigProvider>
+          <InputNumber className="custom-theme-two" defaultValue={1} />
         </Cell>
 
         <h2>{translated['3a42134b']}</h2>

diff --git a/src/packages/uploader/demo.tsx b/src/packages/uploader/demo.tsx
@@ -250,22 +250,23 @@ const UploaderDemo = () => {
     <>
       <div className="demo bg-w demo-uploader">
         <h2>{translated['84aa6bce']}</h2>
-        <Cell>
+        <Cell style={{ flexWrap: 'wrap', paddingBottom: '0px' }}>
           <Uploader
             url={uploadUrl}
             onStart={onStart}
-            style={{ marginRight: '10px' }}
+            style={{ marginRight: '10px', marginBottom: '10px' }}
           />
           <Uploader
             url={uploadUrl}
             uploadLabel="商品主图"
             onStart={onStart}
-            style={{ marginRight: '10px' }}
+            style={{ marginRight: '10px', marginBottom: '10px' }}
           />
           <Uploader
             url={uploadUrl}
             uploadIcon={<Dongdong />}
             onStart={onStart}
+            style={{ marginBottom: '10px' }}
           />
         </Cell>
 

diff --git a/src/styles/variables.scss b/src/styles/variables.scss
@@ -497,7 +497,7 @@ $inputnumber-icon-void-color: var(
 ) !default;
 $inputnumber-icon-disabled-color: var(
   --nutui-inputnumber-icon-disabled-color,
-  #cccccc
+  var(--nutui-gray-3, #cccccc)
 ) !default;
 $inputnumber-icon-size: var(--nutui-inputnumber-icon-size, 20px) !default;
 $inputnumber-input-font-size: var(