Skip to content

fix: 已适配组件, demo不在环境判断+demo优化 #2388

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 6 commits into from
Jun 27, 2024
Merged

fix: 已适配组件, demo不在环境判断+demo优化 #2388

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
0bd4ccb
fix(price): demo优化
irisSong Jun 26, 2024
9f247c6
fix(countdown): demo中已适配组件不在环境判断
irisSong Jun 26, 2024
8747782
fix: demo增加header
irisSong Jun 27, 2024
b67661d
fix(divider): demo优化
irisSong Jun 27, 2024
93088cb
fix(switch): demo 优化
irisSong Jun 27, 2024
ebe6906
fix: 合并线上分支
irisSong Jun 27, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 0 additions & 5 deletions src/packages/countdown/demo.scss
View file
Open in desktop

This file was deleted.

1 change: 0 additions & 1 deletion src/packages/countdown/demo.taro.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,6 @@ import Taro from '@tarojs/taro'
import { View, ScrollView } from '@tarojs/components'
import Header from '@/sites/components/header'
import { useTranslate } from '@/sites/assets/locale/taro'
import './demo.scss'
import Demo1 from './demos/taro/demo1'
import Demo2 from './demos/taro/demo2'
import Demo3 from './demos/taro/demo3'
Expand Down
1 change: 0 additions & 1 deletion src/packages/countdown/demo.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@
import React from 'react'
import { useTranslate } from '../../sites/assets/locale'
import './demo.scss'
import Demo1 from './demos/h5/demo1'
import Demo2 from './demos/h5/demo2'
import Demo3 from './demos/h5/demo3'
Expand Down
16 changes: 8 additions & 8 deletions src/packages/countdown/demos/h5/demo9.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import React, { useRef } from 'react'
import { Cell, CountDown, Grid, GridItem, Button } from '@nutui/nutui-react'
import { Cell, CountDown, Grid, Button } from '@nutui/nutui-react'

interface countdownRefState {
start: () => void
Expand Down Expand Up @@ -31,22 +31,22 @@ const Demo9 = () => {
ref={countDownRef}
/>
</Cell>
<Grid columns="3" style={{ marginBottom: '5px' }}>
<GridItem>
<Grid columns={3} style={{ marginBottom: '5px' }}>
<Grid.Item>
<Button type="primary" onClick={start}>
开始
</Button>
</GridItem>
<GridItem>
</Grid.Item>
<Grid.Item>
<Button type="primary" onClick={pause}>
暂停
</Button>
</GridItem>
<GridItem>
</Grid.Item>
<Grid.Item>
<Button type="primary" onClick={reset}>
重置
</Button>
</GridItem>
</Grid.Item>
Comment on lines +34 to +49
Copy link

@coderabbitai coderabbitai bot Jun 27, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

组件结构优化建议。

代码使用了 Grid 和 Grid.Item 来布局按钮，这是一个良好的实践。不过，可以考虑将按钮的事件处理函数抽象出来，减少代码重复。

- <Button type="primary" onClick={start}>
+ <Button type="primary" onClick={() => handleButtonClick('start')}>
- <Button type="primary" onClick={pause}>
+ <Button type="primary" onClick={() => handleButtonClick('pause')}>
- <Button type="primary" onClick={reset}>
+ <Button type="primary" onClick={() => handleButtonClick('reset')}>
Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
<Grid columns={3} style={{ marginBottom: '5px' }}>
<Grid.Item>
<Button type="primary" onClick={start}>
开始
</Button>
</GridItem>
<GridItem>
</Grid.Item>
<Grid.Item>
<Button type="primary" onClick={pause}>
暂停
</Button>
</GridItem>
<GridItem>
</Grid.Item>
<Grid.Item>
<Button type="primary" onClick={reset}>
重置
</Button>
</GridItem>
</Grid.Item>
<Grid columns={3} style={{ marginBottom: '5px' }}>
<Grid.Item>
<Button type="primary" onClick={() => handleButtonClick('start')}>
开始
</Button>
</Grid.Item>
<Grid.Item>
<Button type="primary" onClick={() => handleButtonClick('pause')}>
暂停
</Button>
</Grid.Item>
<Grid.Item>
<Button type="primary" onClick={() => handleButtonClick('reset')}>
重置
</Button>
</Grid.Item>

</Grid>
</>
)
Expand Down
1 change: 0 additions & 1 deletion src/packages/countdown/demos/taro/demo8.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import React, { useRef, useState } from 'react'
import { Cell, CountDown } from '@nutui/nutui-react-taro'
import { View } from '@tarojs/components'
import '../../demo.scss'
import pxTransform from '@/utils/px-transform'

const partItemStyle = {
Expand Down
53 changes: 11 additions & 42 deletions src/packages/countdown/demos/taro/demo9.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,13 +1,6 @@
import React, { useRef } from 'react'
import {
Cell,
CountDown,
Button,
Grid,
GridItem,
} from '@nutui/nutui-react-taro'
import Taro from '@tarojs/taro'
import { View } from '@tarojs/components'
import { Cell, CountDown, Button, Grid } from '@nutui/nutui-react-taro'
import pxTransform from '@/utils/px-transform'

interface countdownRefState {
start: () => void
Expand Down Expand Up @@ -39,48 +32,24 @@ const Demo9 = () => {
ref={countDownRef}
/>
</Cell>
{/* TODO：gird未适配，适配后替换 */}
{Taro.getEnv() === Taro.ENV_TYPE.RN ? (
<View
style={{
display: 'flex',
flexDirection: 'row',
justifyContent: 'space-around',
paddingTop: 16,
paddingBottom: 16,
marginBottom: 20,
backgroundColor: '#fff',
}}
>

<Grid columns={3} style={{ marginBottom: pxTransform(5) }}>
<Grid.Item>
<Button type="primary" onClick={start}>
开始
</Button>
</Grid.Item>
<Grid.Item>
<Button type="primary" onClick={pause}>
暂停
</Button>
</Grid.Item>
<Grid.Item>
<Button type="primary" onClick={reset}>
重置
</Button>
</View>
) : (
<Grid columns="3" style={{ marginBottom: '5px' }}>
<GridItem>
<Button type="primary" onClick={start}>
开始
</Button>
</GridItem>
<GridItem>
<Button type="primary" onClick={pause}>
暂停
</Button>
</GridItem>
<GridItem>
<Button type="primary" onClick={reset}>
重置
</Button>
</GridItem>
</Grid>
)}
</Grid.Item>
</Grid>
</>
)
}
Expand Down
21 changes: 5 additions & 16 deletions src/packages/divider/demo.taro.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import React from 'react'
import Taro from '@tarojs/taro'
import { ScrollView, View } from '@tarojs/components'
import { Cell } from '@nutui/nutui-react-taro'
import { useTranslate } from '@/sites/assets/locale/taro'
import Header from '@/sites/components/header'
import Demo1 from './demos/taro/demo1'
Expand Down Expand Up @@ -35,32 +34,22 @@ const DividerDemo = () => {
<Header />
<ScrollView className={`demo ${Taro.getEnv() === 'WEB' ? 'web' : ''}`}>
<View className="h2">{translated.basic}</View>
<Cell>
<Demo1 />
</Cell>
<Demo1 />
<View className="h2">{translated.withText}</View>
<Cell>
<Demo2 />
</Cell>
<Demo2 />
<View className="h2">{translated.contentPosition}</View>
<Demo3 />
{/* RN unsupported dashed / dotted border style */}
{Taro.getEnv() !== 'RN' ? (
<>
<View className="h2">{translated.dashed}</View>
<Cell>
<Demo4 />
</Cell>
<Demo4 />
</>
) : null}
<View className="h2">{translated.customStyle}</View>
<Cell>
<Demo5 />
</Cell>
<Demo5 />
<View className="h2">{translated.verticalDivider}</View>
<Cell align="center">
<Demo6 />
</Cell>
<Demo6 />
</ScrollView>
</>
)
Expand Down
21 changes: 5 additions & 16 deletions src/packages/divider/demo.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@
import React from 'react'
import { useTranslate } from '../../sites/assets/locale'
import Cell from '@/packages/cell'
import Demo1 from './demos/h5/demo1'
import Demo2 from './demos/h5/demo2'
import Demo3 from './demos/h5/demo3'
Expand Down Expand Up @@ -31,27 +30,17 @@ const DividerDemo = () => {
<>
<div className="demo">
<h2>{translated.basic}</h2>
<Cell>
<Demo1 />
</Cell>
<Demo1 />
<h2>{translated.withText}</h2>
<Cell>
<Demo2 />
</Cell>
<Demo2 />
<h2>{translated.contentPosition}</h2>
<Demo3 />
<h2>{translated.dashed}</h2>
<Cell>
<Demo4 />
</Cell>
<Demo4 />
<h2>{translated.customStyle}</h2>
<Cell>
<Demo5 />
</Cell>
<Demo5 />
<h2>{translated.verticalDivider}</h2>
<Cell align="center">
<Demo6 />
</Cell>
<Demo6 />
</div>
</>
)
Expand Down
6 changes: 3 additions & 3 deletions src/packages/divider/demos/h5/demo1.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
import React from 'react'
import { Divider } from '@nutui/nutui-react'
import { Cell, Divider } from '@nutui/nutui-react'

const Demo1 = () => {
return (
<>
<Cell>
<Divider />
</>
</Cell>
)
}
export default Demo1
6 changes: 3 additions & 3 deletions src/packages/divider/demos/h5/demo2.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
import React from 'react'
import { Divider } from '@nutui/nutui-react'
import { Cell, Divider } from '@nutui/nutui-react'

const Demo2 = () => {
return (
<>
<Cell>
<Divider>文本</Divider>
</>
</Cell>
)
}
export default Demo2
6 changes: 3 additions & 3 deletions src/packages/divider/demos/h5/demo4.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
import React from 'react'
import { Divider } from '@nutui/nutui-react'
import { Cell, Divider } from '@nutui/nutui-react'

const Demo4 = () => {
return (
<>
<Cell>
<Divider style={{ borderStyle: 'dashed' }}>文本</Divider>
</>
</Cell>
)
}
export default Demo4
6 changes: 3 additions & 3 deletions src/packages/divider/demos/h5/demo5.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
import React from 'react'
import { Divider } from '@nutui/nutui-react'
import { Cell, Divider } from '@nutui/nutui-react'

const Demo5 = () => {
return (
<>
<Cell>
<Divider
style={{
color: '#1989fa',
Expand All @@ -14,7 +14,7 @@ const Demo5 = () => {
>
文本
</Divider>
</>
</Cell>
)
}
export default Demo5
6 changes: 3 additions & 3 deletions src/packages/divider/demos/h5/demo6.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
import React from 'react'
import { Divider } from '@nutui/nutui-react'
import { Cell, Divider } from '@nutui/nutui-react'

const Demo6 = () => {
return (
<>
<Cell align="center">
文本
<Divider direction="vertical" />
<a href="#" style={{ color: '#1989fa' }}>
Expand All @@ -13,7 +13,7 @@ const Demo6 = () => {
<a href="#" style={{ color: '#1989fa' }}>
链接
</a>
</>
</Cell>
)
}
export default Demo6
6 changes: 3 additions & 3 deletions src/packages/divider/demos/taro/demo1.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
import React from 'react'
import { Divider } from '@nutui/nutui-react-taro'
import { Cell, Divider } from '@nutui/nutui-react-taro'

const Demo1 = () => {
return (
<>
<Cell>
<Divider />
</>
</Cell>
)
}
export default Demo1
6 changes: 3 additions & 3 deletions src/packages/divider/demos/taro/demo2.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
import React from 'react'
import { Divider } from '@nutui/nutui-react-taro'
import { Cell, Divider } from '@nutui/nutui-react-taro'

const Demo2 = () => {
return (
<>
<Cell>
<Divider>文本</Divider>
</>
</Cell>
)
}
export default Demo2
8 changes: 6 additions & 2 deletions src/packages/divider/demos/taro/demo4.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,11 @@
import React from 'react'
import { Divider } from '@nutui/nutui-react-taro'
import { Cell, Divider } from '@nutui/nutui-react-taro'

const Demo4 = () => {
return <Divider style={{ borderStyle: 'dashed' }}>文本</Divider>
return (
<Cell>
<Divider style={{ borderStyle: 'dashed' }}>文本</Divider>
</Cell>
)
}
export default Demo4
6 changes: 3 additions & 3 deletions src/packages/divider/demos/taro/demo5.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
import React from 'react'
import { Divider } from '@nutui/nutui-react-taro'
import { Cell, Divider } from '@nutui/nutui-react-taro'
import { rn } from '@/utils/platform-taro'
import pxTransform from '@/utils/px-transform'

const Demo5 = () => {
return (
<>
<Cell>
<Divider
style={{
color: '#1989fa',
Expand All @@ -17,7 +17,7 @@ const Demo5 = () => {
>
文本
</Divider>
</>
</Cell>
)
}
export default Demo5
6 changes: 3 additions & 3 deletions src/packages/divider/demos/taro/demo6.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,16 +1,16 @@
import React from 'react'
import { Divider } from '@nutui/nutui-react-taro'
import { Cell, Divider } from '@nutui/nutui-react-taro'
import { Text } from '@tarojs/components'

const Demo6 = () => {
return (
<>
<Cell align="center">
<Text>文本</Text>
<Divider direction="vertical" />
<Text style={{ color: '#1989fa' }}>链接</Text>
<Divider direction="vertical" />
<Text style={{ color: '#1989fa' }}>链接</Text>
</>
</Cell>
)
}
export default Demo6
Loading