Skip to content
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

fix: space harmony #2817

Merged
merged 2 commits into from
Dec 4, 2024
Merged

fix: space harmony #2817

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
1169045
fix: space harmony
xiaoyatong Dec 3, 2024
88379d4
fix: 改用 space 标签
xiaoyatong Dec 4, 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
48 changes: 30 additions & 18 deletions packages/nutui-taro-demo/src/pages/index/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,16 @@
import Taro from '@tarojs/taro'
import { View, Image, Swiper, SwiperItem, Text, ScrollView, Button, Input, Video } from '@tarojs/components'
import {
View,
Image,
Swiper,
SwiperItem,
Text,
ScrollView,
Button,
Input,
Video,
Textarea,
} from '@tarojs/components'
import pkg from '@/packages/../config.json'
import packageJson from '@/packages/../../package.json'
import './index.scss'
Expand All @@ -8,9 +19,8 @@ import './index.scss'
const navs = pkg.nav
// console.log(navs)


// hack taro load button xml
console.log(Button, Input, Video,Image, Swiper, SwiperItem, )
console.log(Button, Input, Video, Image, Swiper, SwiperItem, Textarea)

// try {
// console.log('xxx', Schema)
Expand Down Expand Up @@ -39,37 +49,39 @@ const Index = () => {
}

return (
<ScrollView className='index'>
<View className='index-header'>
<ScrollView className="index">
<View className="index-header">
<Image
className='index-header-img'
src='https://img14.360buyimg.com/imagetools/jfs/t1/117879/25/28831/6279/6329723bE66715a2f/5f099b8feca9e8cc.png'
className="index-header-img"
src="https://img14.360buyimg.com/imagetools/jfs/t1/117879/25/28831/6279/6329723bE66715a2f/5f099b8feca9e8cc.png"
/>
<View className='index-header-info'>
<View className='index-header-info-h1'>NutUI React</View>
<View className='index-header-info-p'>
<View className="index-header-info">
<View className="index-header-info-h1">NutUI React</View>
<View className="index-header-info-p">
京东风格的轻量级小程序组件库 React 版
</View>
<View className='index-header-info-p'>
<Text className='index-header-info-text'>v{packageJson?.version}</Text>
<View className="index-header-info-p">
<Text className="index-header-info-text">
v{packageJson?.version}
</Text>
</View>
</View>
</View>
<View className='index-components'>
<View className="index-components">
{navs.map((nav) => (
<View key={nav.enName} className='index-components-item'>
<View key={nav.enName} className="index-components-item">
{nav.enName === 'dataentry' ? null : (
<View className='index-components-item-title'>{nav.name}</View>
<View className="index-components-item-title">{nav.name}</View>
)}
<View className='index-components-sublist'>
<View className="index-components-sublist">
{nav.packages.map((com) =>
com.show && com.taro && com.version === '3.0.0' ? (
<View
key={com.name}
className='index-components-sublist-item'
className="index-components-sublist-item"
>
<View
className='index-components-sublist-item-content'
className="index-components-sublist-item-content"
key={com.name}
onClick={() => gotoNext(com.name, nav.enName)}
>
Expand Down
28 changes: 7 additions & 21 deletions src/packages/space/demo.taro.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,13 +1,12 @@
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'
import Demo2 from './demos/taro/demo2'
import Demo3 from './demos/taro/demo3'
// import Demo4 from './demos/taro/demo4'
import Demo4 from './demos/taro/demo4'
import Demo5 from './demos/taro/demo5'
import Demo6 from './demos/taro/demo6'

Expand Down Expand Up @@ -44,30 +43,17 @@ const SpaceDemo = () => {
<Header />
<ScrollView className={`demo ${Taro.getEnv() === 'WEB' ? 'web' : ''}`}>
<View className="h2">{translated.basic}</View>
<Cell>
<Demo1 />
</Cell>
<Demo1 />
<View className="h2">{translated.wrap}</View>
<Cell>
<Demo2 />
</Cell>
<Demo2 />
<View className="h2">{translated.direction}</View>
<Cell>
<Demo3 />
</Cell>
<Demo3 />
<View className="h2">{translated.spaceGap}</View>
{/* @TODO ConfigProvider 暂不支持 */}
{/* <Cell>
<Demo4 />
</Cell> */}
<Demo4 />
irisSong marked this conversation as resolved.
Show resolved Hide resolved
<View className="h2">{translated.mainAxisAlign}</View>
<Cell style={{ display: 'block' }}>
<Demo5 />
</Cell>
<Demo5 />
<View className="h2">{translated.crossAxisAlign}</View>
<Cell>
<Demo6 />
</Cell>
<Demo6 />
</ScrollView>
</>
)
Expand Down
25 changes: 6 additions & 19 deletions src/packages/space/demo.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
import React from 'react'
import Cell from '@/packages/cell'
import { useTranslate } from '@/sites/assets/locale'
import Demo1 from './demos/h5/demo1'
import Demo2 from './demos/h5/demo2'
Expand Down Expand Up @@ -40,29 +39,17 @@ const SpaceDemo = () => {
<>
<div className="demo">
<h2>{translated.basic}</h2>
<Cell>
<Demo1 />
</Cell>
<Demo1 />
xiaoyatong marked this conversation as resolved.
Show resolved Hide resolved
<h2>{translated.wrap}</h2>
<Cell>
<Demo2 />
</Cell>
<Demo2 />
<h2>{translated.direction}</h2>
<Cell>
<Demo3 />
</Cell>
<Demo3 />
<h2>{translated.spaceGap}</h2>
<Cell>
<Demo4 />
</Cell>
<Demo4 />
<h2>{translated.mainAxisAlign}</h2>
<Cell style={{ display: 'block' }}>
<Demo5 />
</Cell>
<Demo5 />
<h2>{translated.crossAxisAlign}</h2>
<Cell>
<Demo6 />
</Cell>
<Demo6 />
</div>
</>
)
Expand Down
14 changes: 8 additions & 6 deletions src/packages/space/demos/h5/demo1.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,13 +1,15 @@
import React from 'react'
import { Space, Button } from '@nutui/nutui-react'
import { Space, Button, Cell } from '@nutui/nutui-react'

const Demo1 = () => {
return (
<Space>
<Button>按钮1</Button>
<Button>按钮2</Button>
<Button>按钮3</Button>
</Space>
<Cell>
<Space>
<Button>按钮1</Button>
<Button>按钮2</Button>
<Button>按钮3</Button>
</Space>
</Cell>
)
}
export default Demo1
20 changes: 11 additions & 9 deletions src/packages/space/demos/h5/demo2.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,16 +1,18 @@
import React from 'react'
import { Space, Button } from '@nutui/nutui-react'
import { Space, Button, Cell } from '@nutui/nutui-react'

const Demo2 = () => {
return (
<Space wrap>
<Button>按钮1</Button>
<Button>按钮2</Button>
<Button>按钮3</Button>
<Button>按钮4</Button>
<Button>按钮5</Button>
<Button>按钮6</Button>
</Space>
<Cell>
<Space wrap>
<Button>按钮1</Button>
<Button>按钮2</Button>
<Button>按钮3</Button>
<Button>按钮4</Button>
<Button>按钮5</Button>
<Button>按钮6</Button>
</Space>
</Cell>
)
}
export default Demo2
14 changes: 8 additions & 6 deletions src/packages/space/demos/h5/demo3.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,13 +1,15 @@
import React from 'react'
import { Space, Button } from '@nutui/nutui-react'
import { Space, Button, Cell } from '@nutui/nutui-react'

const Demo3 = () => {
return (
<Space direction="vertical">
<Button>按钮1</Button>
<Button>按钮2</Button>
<Button>按钮3</Button>
</Space>
<Cell>
<Space direction="vertical">
<Button>按钮1</Button>
<Button>按钮2</Button>
<Button>按钮3</Button>
</Space>
</Cell>
)
}
export default Demo3
26 changes: 14 additions & 12 deletions src/packages/space/demos/h5/demo4.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,19 +1,21 @@
import React from 'react'
import { Space, Button, ConfigProvider } from '@nutui/nutui-react'
import { Space, Button, ConfigProvider, Cell } from '@nutui/nutui-react'

const Demo4 = () => {
return (
<ConfigProvider
theme={{
nutuiSpaceGap: '20px',
}}
>
<Space direction="vertical">
<Button>按钮1</Button>
<Button>按钮2</Button>
<Button>按钮3</Button>
</Space>
</ConfigProvider>
<Cell>
<ConfigProvider
theme={{
nutuiSpaceGap: '20px',
}}
>
<Space direction="vertical">
<Button>按钮1</Button>
<Button>按钮2</Button>
<Button>按钮3</Button>
</Space>
</ConfigProvider>
</Cell>
)
}
export default Demo4
34 changes: 15 additions & 19 deletions src/packages/space/demos/h5/demo5.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,26 +1,22 @@
import React from 'react'
import { Space, Button } from '@nutui/nutui-react'
import { Space, Button, Cell } from '@nutui/nutui-react'

const Demo5 = () => {
return (
<Space justify="start" wrap>
<Button>按钮1</Button>
<div>
<Button block style={{ marginBottom: 5 }}>
按钮2
</Button>
<Button block>按钮2</Button>
</div>
<div>
<Button block style={{ marginBottom: 5 }}>
按钮3
</Button>
<Button block style={{ marginBottom: 5 }}>
按钮3
</Button>
<Button block>按钮3</Button>
</div>
</Space>
<Cell>
<Space justify="start" wrap>
<Button>按钮1</Button>
<div>
<Button style={{ marginBottom: 5 }}>按钮2</Button>
<Button>按钮2</Button>
</div>
<div>
<Button style={{ marginBottom: 5 }}>按钮3</Button>
<Button style={{ marginBottom: 5 }}>按钮3</Button>
<Button>按钮3</Button>
</div>
</Space>
</Cell>
)
}
export default Demo5
34 changes: 15 additions & 19 deletions src/packages/space/demos/h5/demo6.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,26 +1,22 @@
import React from 'react'
import { Space, Button } from '@nutui/nutui-react'
import { Space, Button, Cell } from '@nutui/nutui-react'

const Demo6 = () => {
return (
<Space align="end" wrap>
<Button>按钮1</Button>
<div>
<Button block style={{ marginBottom: 5 }}>
按钮2
</Button>
<Button block>按钮2</Button>
</div>
<div>
<Button block style={{ marginBottom: 5 }}>
按钮3
</Button>
<Button block style={{ marginBottom: 5 }}>
按钮3
</Button>
<Button block>按钮3</Button>
</div>
</Space>
<Cell>
<Space align="end" wrap>
<Button>按钮1</Button>
<div>
<Button style={{ marginBottom: 5 }}>按钮2</Button>
<Button>按钮2</Button>
</div>
<div>
<Button style={{ marginBottom: 5 }}>按钮3</Button>
<Button style={{ marginBottom: 5 }}>按钮3</Button>
<Button>按钮3</Button>
</div>
</Space>
xiaoyatong marked this conversation as resolved.
Show resolved Hide resolved
</Cell>
)
}
export default Demo6
14 changes: 8 additions & 6 deletions src/packages/space/demos/taro/demo1.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,13 +1,15 @@
import React from 'react'
import { Space, Button } from '@nutui/nutui-react-taro'
import { Cell, Space, Button } from '@nutui/nutui-react-taro'

const Demo1 = () => {
return (
<Space>
<Button>按钮1</Button>
<Button>按钮2</Button>
<Button>按钮3</Button>
</Space>
<Cell>
<Space>
<Button>按钮1</Button>
<Button>按钮2</Button>
<Button>按钮3</Button>
</Space>
</Cell>
)
}
export default Demo1
Loading
Loading