Skip to content

Commit 619ac30

Browse files
ChenlingasMxrenovate[bot]renovate-botjaywcjlovedependabot[bot]
authored
feat: 修复 Tabs example 报错 & react-native-svg 依赖报错 & 添加 QuickList 组件 (#162)
* chore(deps): add renovate.json (#6) Co-authored-by: Renovate Bot <bot@renovateapp.com> * chore(deps): pin dependencies (#7) Co-authored-by: Renovate Bot <bot@renovateapp.com> * chore(deps): update react-navigation monorepo * fix(deps): update dependency @types/color to v3.0.1 * chore(deps): update dependency react-navigation-stack to v2 * released v1.6.1 * feat(CheckBox): Enhance checkedIcon/unCheckedIcon props. * chore: Update @uiw/icons to v2.4.3 * released v1.6.2 * doc(CheckBox): Update README.md * feat: Modify unCheckedIcon default value. * released v1.6.3 * chore(deps): Update react-native to v0.62.2 * chore(deps): pin dependencies * chore(deps): update dependency tsbb to v1.7.3 * chore: Modify example. * chore: Fix homepage layout issue. * chore: Format the code. * released v1.7.0 * released v1.7.1 * chore: Remove redundant codes. * released v1.7.2 * feat: Add MaskLayer component. * feat: Add usePrevious. * fix: Fix Animated errors. * fix: Fix Modal style. * released v1.7.3 * released v1.7.4 * Update dependency tsbb to v1.7.4 * Update dependency react-native-safe-area-context to v2 * Update dependency @types/react-native to v0.62.11 * Update react-navigation monorepo * Update dependency react-native-safe-area-context to v2.0.1 * Update react-navigation monorepo * Update dependency react-native-safe-area-context to v3 * chore(deps): bump lodash from 4.17.15 to 4.17.19 Bumps [lodash](https://github.com/lodash/lodash) from 4.17.15 to 4.17.19. - [Release notes](https://github.com/lodash/lodash/releases) - [Commits](lodash/lodash@4.17.15...4.17.19) Signed-off-by: dependabot[bot] <support@github.com> * Update dependency tsbb to v1.7.6 * Upgrade react-native to v0.63.2 (#61) Co-authored-by: songjie@nihaosi.com <songjie@nihaosi.com> * 恢复babel.config的eslink,删除不需要上传的flowconfig (#65) * react-native升级0.63.2 * 恢复babel的eslink * flx删除不需要上传的flowconfig Co-authored-by: songjie@nihaosi.com <songjie@nihaosi.com> * chore(deps): bump logkitty from 0.6.1 to 0.7.1 Bumps [logkitty](https://github.com/zamotany/logkitty) from 0.6.1 to 0.7.1. - [Release notes](https://github.com/zamotany/logkitty/releases) - [Commits](zamotany/logkitty@v0.6.1...v0.7.1) Signed-off-by: dependabot[bot] <support@github.com> * doc: Update README.md * fix:解决MenuDropdown组件下拉报错 * 升级TypeScript，注释babel.config.js两行代码 (#68) * react-native升级0.63.2 * 恢复babel的eslink * flx删除不需要上传的flowconfig * flx升级TypeScript，注释babel.config.js两行代码 Co-authored-by: songjie@nihaosi.com <songjie@nihaosi.com> * Create LICENSE * fix(SelectCascader): update native Pick * chore: Update ios/UIW.xcodeproj/project.pbxproj &yarn.lock * chore: Update dependencies * released v1.7.5 * fix: update react-native-svg * fix: update react-native-svg * doc: Update README.md * chore: Update dependencies. * released v1.7.5 * released v1.7.6 * chore(deps): pin dependencies * chore: remove package-lock.json * chore(deps): update dependency typescript to v4 * chore: Update yarn.lock * doc: Update README.md * chore(deps): update dependency tsbb to v1.7.8 * fix(Icon): Add fill default value. * chore(deps): update dependency react-native to v0.64 * chore: update yarn.lock * released v1.7.6 * type: Fix type errors. * released v1.7.6 * released v1.8.0 * fix:SearchBar组件 * released v1.9.0 * type(SearchBar): Fix type errors. #93 * released v1.9.1 * fix:SearchBar组件 * fix:Table表格 * #95 * released v1.10.0 * chore(doc): Update README.md * fix(deps): update dependency @react-native-picker/picker to v1.16.0 * chore(deps): update react-navigation monorepo * Wx (#103) * fix:解决MenuDropdown组件下拉报错 * fix:SearchBar组件 * fix:Table表格 * fix:展开组件封装,修复xcode14.5无法运行问题 * fix:update package.json * released v1.11.0 * chore: publish npm using workflows. * chore: update workflows config. * type: fix tsconfig.json errors. * chore(deps): update dependency fs-extra to v10 * chore(deps): update dependency prettier to v2.3.1 * chore(deps): update dependency tsbb to v2.2.1 * fix(deps): update dependency @uiw/icons to v2.5.1 * chore(deps): update dependencies. * released v1.12.0 * fix:team团队页面调用github用户信息接口 * fix:解决svg报错 * fix:Tab example报错和封装quickList 组件 Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> Co-authored-by: Renovate Bot <bot@renovateapp.com> Co-authored-by: jaywcjlove <398188662@qq.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: cc <33281802+matuanc@users.noreply.github.com> Co-authored-by: songjie@nihaosi.com <songjie@nihaosi.com> Co-authored-by: 小弟调调™ <kennyiseeyou@gmail.com> Co-authored-by: xingyuefeng <15262870437@163.com>
1 parent e0bd6a4 commit 619ac30

File tree

10 files changed

+498
-79
lines changed

10 files changed

+498
-79
lines changed

‎example/examples/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@
1919
"react-native-gesture-handler": "1.10.3",
2020
"react-native-safe-area-context": "3.2.0",
2121
"react-native-screens": "3.5.0",
22-
"react-native-svg": "12.1.1"
22+
"react-native-svg": "12.1.0"
2323
},
2424
"devDependencies": {
2525
"@babel/core": "7.14.8",

‎example/examples/src/Home.tsx‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import React from 'react';
2-
import {View, StyleSheet, ScrollView} from 'react-native';
3-
import {StackNavigationProp} from '@react-navigation/stack';
4-
import {stackPageData} from './routes';
2+
import { View, StyleSheet, ScrollView } from 'react-native';
3+
import { StackNavigationProp } from '@react-navigation/stack';
4+
import { stackPageData } from './routes';
55
import { Grid } from '@uiw/react-native';
66

77
const styles = StyleSheet.create({
@@ -12,21 +12,21 @@ const styles = StyleSheet.create({
1212

1313
type ModalStackNavigation = StackNavigationProp<{}>;
1414

15-
export default ({ navigation }: { navigation: ModalStackNavigation }) => {
15+
export default ({ navigation }: { navigation: ModalStackNavigation }) => {
1616
const uri = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADYAAAA2CAMAAAC7m5rvAAAAllBMVEUAAAC/v7+qqqrHx8evr6/ExMS5ubmxsbGsrKysrKytra2pqam8vLy9vb2lpaXExMT////s7Oz8/Pz09PTu7u729vb5+fnp6enMzMzLy8vm5ub4+Pjj4+O3t7fx8fHb29vAwMDHx8ePj4/S0tLf39+rq6ulpaWSkpK7u7vY2NjR0dGnp6eenp6ampqysrLPz8+fn5+ioqKXtObzAAAAEHRSTlMA6wT4/e/f0KyZSy/z8mz4uKbH2gAAA6FJREFUSMellody2zAMhuXEGU6TVBgkbGp529np+79cKREUpbrxdfxnn7g+cYACkKku7m5vricPl4v5Yq5arWLJN14+TK5vbu8udLhCsyuHeY6QD0Q0rEHb765mA/DbJIw4j4XGybdIPV5q13lMC9NHnWvKpxhiAVBYPMX4ezffxSQnHmFoahFgkRpEmHCEMeWTdn8zygOnmAVhkxZZ1AImYdyOnvnJrrohrBiymF/3ZgGsYty1XV1kdy6MATKGnJRgoiAVuRRH/inhTe4uu9U1Q8MMmy0nOcdJ5bMwbEs9g9vsJg8yjq2UXxugdJYBtHKTXUeM64bO2c00bGP/dTbBIAIBERyIaFgTASHQyiS7hyC3KaHcQNSm2r2+vbwvBFRt91OjlfssXizZ+q2WjN3yqvXrcfWxmS/362lYGJfYjQm6zBah4InWbtRyy3UlGPaGvDxU6B8EvqVo9NgX2TwUGDosJzb7vQyPBHafxNSZ2zq9hXOdzYoJWM6Hyo5P0h4PkAcMwI5mAxOx/bvgGEOpfqBihoezoeSKLffWAA4xBLIvS8VywYR5RjFaix8PmDBs77+sa8XYDDA2ilVV9xbAiCF0cFUpZniASa6Yn0y5aICO8tMplkvCMGKbV8x7jqhbYSf8fI4YJgwUq46+FjmillIdK8UgYQUrtlvliaspUflqpxgXHbYiIhD/d77w+kG9oGkg1T5eiYhLImkbV2PsbUO96qcnStq8jbCwyFoX+TJPjhK8kpucv+gi66LfmwXF3peJMkQmcct3xcCeGmCxx55qDdBzuF8kA5yYW9bcUy3Wc7x2p+bOuQgYTJdKxctVBG65g4AVMMCoVgwOECjFlOMDKFbTbz+camcRilwxvS84rX79cPQztYrh51HM+DMtZPmGilkYOQUDiuX1iVPA44F7p2DGLghYZwP+8SJDjKdvADqbg+SCOtmyw9p94anDKwCDw7Pq8JJ7LduTga69rtaf0b3uIJyneAySe32AIPdc+r8D1bM6c23oulzvzB9S6BDnf1+HDifkUugYBCrT1OcCVd1QClQpLALQubDoHAGlsBiDMG3J0pMUthdzKhfw5LtLiUE4hnx0AgDNtnEQVZYQ5XyHf8jWasjXBAPBxgQDziQYFqwmGNmMlIrpDH+ZzihHs5A8+co4eeKUPEFKngKHIXnKvn0H++epmoWppoaP079JDL8//lsa+p9Jb0qx77sUexG0WmmhS7HvRyn2TxZ1zUyK+LY0AAAAAElFTkSuQmCC';
17-
17+
1818
const data = Array.from(stackPageData.map((_val, i) => {
1919
return { icon: uri, text: _val.name }
2020
}));
2121
return (
2222
<ScrollView>
2323
<View style={styles.block}>
24-
<Grid
24+
<Grid
2525
data={data}
2626
columns={3}
2727
itemStyle={{ height: 100 }}
28-
onPress={(data1,index) => {
29-
navigation.push(data1.text as never,{...stackPageData[index].params} as never)
28+
onPress={(data1: any, index: number) => {
29+
navigation.push(data1.text as never, { ...stackPageData[index].params } as never)
3030
}}
3131
/>
3232
</View>

‎example/examples/src/routes.tsx‎

Lines changed: 18 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { StackNavigationProp } from '@react-navigation/stack';
1+
import {StackNavigationProp} from '@react-navigation/stack';
22

33
type ModalStackNavigation = StackNavigationProp<{}>;
44

@@ -7,7 +7,6 @@ export interface ComProps {
77
route: Routes;
88
}
99

10-
1110
export type Routes = {
1211
name: string;
1312
component: JSX.Element;
@@ -281,7 +280,7 @@ export const stackPageData: Routes[] = [
281280
params: {
282281
title: 'Steps 步骤条',
283282
description: '步骤条',
284-
}
283+
},
285284
},
286285
{
287286
name: 'Rating',
@@ -299,12 +298,20 @@ export const stackPageData: Routes[] = [
299298
description: '时间轴',
300299
},
301300
},
302-
{
303-
name: 'Tabs',
304-
component: require('./routes/Tabs').default,
305-
params: {
306-
title: 'Tabs 选项卡',
307-
description: 'Tabs 选项卡组件跨不同屏幕、数据集和其他交互的内容。',
308-
},
309-
},
301+
// {
302+
// name: 'Tabs',
303+
// component: require('./routes/Tabs').default,
304+
// params: {
305+
// title: 'Tabs 选项卡',
306+
// description: 'Tabs 选项卡组件跨不同屏幕、数据集和其他交互的内容。',
307+
// },
308+
// },
309+
// {
310+
// name: 'QuickList',
311+
// component: require('./routes/QuickList').default,
312+
// params: {
313+
// title: 'QuickList 快速请求列表',
314+
// description: 'QuickList 快速请求上拉下拉数据列表',
315+
// },
316+
// },
310317
];

‎example/examples/src/routes/QuickList/index.tsx‎

Lines changed: 79 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
import React, {useRef, useState} from 'react';
2+
import {SafeAreaView} from 'react-native';
3+
import {QuickList, List} from '@uiw/react-native';
4+
import {ComProps} from '../../routes';
5+
import Layout from '../../Layout';
6+
const {Header} = Layout;
7+
8+
export interface ListViewProps extends ComProps {}
9+
10+
interface fethProp {
11+
page: number;
12+
pageSize: number;
13+
}
14+
15+
const defaultData: Array<{name: string; id: number}> = [
16+
{name: '最好用的快速List列表', id: 1},
17+
{name: '最好用的快速List列表', id: 2},
18+
{name: '最好用的快速List列表', id: 3},
19+
{name: '最好用的快速List列表', id: 4},
20+
{name: '最好用的快速List列表', id: 5},
21+
{name: '最好用的快速List列表', id: 6},
22+
{name: '最好用的快速List列表', id: 7},
23+
{name: '最好用的快速List列表', id: 8},
24+
{name: '最好用的快速List列表', id: 9},
25+
{name: '最好用的快速List列表', id: 10},
26+
];
27+
28+
const QuickListView = (props: ListViewProps) => {
29+
const baseRef = useRef();
30+
const {route} = props;
31+
const description = route.params.description;
32+
const title = route.params.title;
33+
const [total, setTotal] = useState(0);
34+
const [data, setData] = useState<Array<{name: string; id: number}>>([]);
35+
36+
const sleep = (time: any) =>
37+
new Promise(resolve => setTimeout(() => resolve(''), time));
38+
// 模拟请求
39+
const fethList = async (params: fethProp) => {
40+
const {page, pageSize} = params;
41+
if (page === 1) {
42+
await sleep(500);
43+
setData(defaultData);
44+
} else {
45+
let fetchData = [];
46+
for (let i = 0; i < pageSize; i++) {
47+
const id = data.length + (1 / 10) * pageSize + i;
48+
const name = '最好用的快速List列表';
49+
let obj = {name, id};
50+
fetchData.push(obj);
51+
}
52+
let newData = [...data, ...fetchData];
53+
await sleep(500);
54+
setData(newData);
55+
}
56+
setTotal(40);
57+
};
58+
59+
return (
60+
<SafeAreaView style={{flex: 1}}>
61+
<Header title={title} description={description} />
62+
<QuickList
63+
ref={baseRef}
64+
onFetch={fethList}
65+
data={data}
66+
total={total}
67+
renderItem={({item}) => (
68+
<List flat={false}>
69+
<List.Item
70+
style={{height: 70}}>{`${item.id}-${item.name}`}</List.Item>
71+
</List>
72+
)}
73+
keyId="id"
74+
/>
75+
</SafeAreaView>
76+
);
77+
};
78+
79+
export default QuickListView;

‎example/examples/src/routes/Tabs/index.tsx‎

Lines changed: 81 additions & 58 deletions
Original file line numberDiff line numberDiff line change
@@ -1,126 +1,149 @@
1-
import React, { Component } from 'react';
2-
import { StyleSheet, View } from 'react-native';
3-
import Layout, { Container } from '../../Layout';
4-
import { Tabs, Icon, IconsName } from '@uiw/react-native';
5-
import { ComProps } from '../../routes';
6-
import { Text } from 'react-native-svg';
1+
import React, {Component} from 'react';
2+
import {StyleSheet, View} from 'react-native';
3+
import Layout, {Container} from '../../Layout';
4+
import {Tabs, Icon, IconsName} from '@uiw/react-native';
5+
import {ComProps} from '../../routes';
6+
import {Text} from 'react-native-svg';
77

8-
const { Header, Body, Card, Footer } = Layout;
8+
const {Header, Body, Card, Footer} = Layout;
99

1010
export interface listItem {
11-
title: string | React.ReactElement | React.ReactNode,
12-
icon: IconsName | React.ReactElement | React.ReactNode,
11+
title: string | React.ReactElement | React.ReactNode;
12+
icon: IconsName | React.ReactElement | React.ReactNode;
1313
}
14-
export interface IndexProps extends ComProps { }
14+
export interface IndexProps extends ComProps {}
1515
export interface IndexState {
16-
flag1: string,
17-
flag: string,
18-
color1: string,
16+
flag1: string;
17+
flag: string;
18+
color1: string;
1919
}
2020

2121
export default class Index extends Component<IndexProps, IndexState> {
2222
constructor(props: IndexProps) {
23-
super(props)
23+
super(props);
2424
this.state = {
2525
flag: '喜欢',
2626
flag1: '喜欢',
27-
color1: '#f18700'
28-
}
27+
color1: '#f18700',
28+
};
2929
}
3030
onPress1 = (val: string) => {
31-
this.setState({flag: val})
32-
}
31+
this.setState({flag: val});
32+
};
3333
onPress = (val: string) => {
34-
this.setState({flag1: val})
35-
}
34+
this.setState({flag1: val});
35+
};
3636
render() {
37-
const { route } = this.props;
37+
const {route} = this.props;
3838
const description = route.params.description;
3939
const title = route.params.title;
40-
const { Item } = Tabs
40+
const {Item} = Tabs;;
4141
return (
4242
<Container>
4343
<Layout>
4444
<Header title={title} description={description} />
4545
<Body>
4646
<Tabs>
47-
<Item
47+
<Item
4848
title={'喜欢'}
49-
icon='heart-on'
49+
icon="heart-on"
5050
style={{
51-
iconColor: this.state.flag === '喜欢'?this.state.color1:undefined,
52-
titleColor: this.state.flag === '喜欢'?this.state.color1:undefined
51+
iconColor:
52+
this.state.flag === '喜欢' ? this.state.color1 : undefined,
53+
titleColor:
54+
this.state.flag === '喜欢' ? this.state.color1 : undefined,,
5355
}}
5456
border={this.state.flag === '喜欢'}
5557
onPress={this.onPress1}
5658
/>
57-
<Tabs.Item
58-
title={"关注"}
59+
<Tabs.Item
60+
title={'关注'}
5961
style={{
60-
titleColor: this.state.flag === '关注'?this.state.color1:undefined
62+
titleColor:
63+
this.state.flag === '关注' ? this.state.color1 : undefined,,
6164
}}
62-
icon={<Icon name='star-on' color={this.state.flag === '关注'?this.state.color1:"#fff"} size={24} />}
65+
icon={
66+
<Icon
67+
name="star-on"
68+
color={
69+
this.state.flag === '关注' ? this.state.color1 : '#fff'
70+
}
71+
size={24}
72+
/>
73+
}
6374
border={this.state.flag === '关注'}
6475
onPress={this.onPress1}
6576
/>
66-
<Tabs.Item
67-
title={"信息"}
68-
icon='mail'
77+
<Tabs.Item
78+
title={'信息'}
79+
icon="mail"
6980
style={{
70-
iconColor: this.state.flag === '信息'?this.state.color1:undefined,
71-
titleColor: this.state.flag === '信息'?this.state.color1:undefined
81+
iconColor:
82+
this.state.flag === '信息' ? this.state.color1 : undefined,
83+
titleColor:
84+
this.state.flag === '信息' ? this.state.color1 : undefined,,
7285
}}
7386
border={this.state.flag === '信息'}
7487
onPress={this.onPress1}
7588
/>
7689
</Tabs>
77-
90+
7891
<View style={styles.divider} />
7992

8093
<Tabs>
81-
<Tabs.Item
94+
<Tabs.Item
8295
title={'喜欢'}
8396
border={this.state.flag1 === '喜欢'}
8497
onPress={this.onPress}
8598
style={{
86-
titleColor: this.state.flag1 === '喜欢'?this.state.color1:undefined,
87-
borderColor: this.state.flag1 === '喜欢'?this.state.color1:undefined
99+
titleColor:
100+
this.state.flag1 === '喜欢' ? this.state.color1 : undefined,
101+
borderColor:
102+
this.state.flag1 === '喜欢' ? this.state.color1 : undefined,,
88103
}}
89104
/>
90-
<Tabs.Item
91-
title={"关注"}
105+
<Tabs.Item
106+
title={'关注'}
92107
border={this.state.flag1 === '关注'}
93108
onPress={this.onPress}
94109
style={{
95-
titleColor: this.state.flag1 === '关注'?this.state.color1:undefined,
96-
borderColor: this.state.flag1 === '关注'?this.state.color1:undefined
110+
titleColor:
111+
this.state.flag1 === '关注' ? this.state.color1 : undefined,
112+
borderColor:
113+
this.state.flag1 === '关注' ? this.state.color1 : undefined,,
97114
}}
98115
/>
99-
<Tabs.Item
100-
title={"信息"}
116+
<Tabs.Item
117+
title={'信息'}
101118
border={this.state.flag1 === '信息'}
102119
onPress={this.onPress}
103120
style={{
104-
titleColor: this.state.flag1 === '信息'?this.state.color1:undefined,
105-
borderColor: this.state.flag1 === '信息'?this.state.color1:undefined
121+
titleColor:
122+
this.state.flag1 === '信息' ? this.state.color1 : undefined,
123+
borderColor:
124+
this.state.flag1 === '信息' ? this.state.color1 : undefined,,
106125
}}
107126
/>
108-
<Tabs.Item
109-
title={"我的"}
127+
<Tabs.Item
128+
title={'我的'}
110129
border={this.state.flag1 === '我的'}
111130
onPress={this.onPress}
112131
style={{
113-
titleColor: this.state.flag1 === '我的'?this.state.color1:undefined,
114-
borderColor: this.state.flag1 === '我的'?this.state.color1:undefined
132+
titleColor:
133+
this.state.flag1 === '我的' ? this.state.color1 : undefined,
134+
borderColor:
135+
this.state.flag1 === '我的' ? this.state.color1 : undefined,,
115136
}}
116137
/>
117-
<Tabs.Item
118-
title={"偏好"}
138+
<Tabs.Item
139+
title={'偏好'}
119140
border={this.state.flag1 === '偏好'}
120141
onPress={this.onPress}
121142
style={{
122-
titleColor: this.state.flag1 === '偏好'?this.state.color1:undefined,
123-
borderColor: this.state.flag1 === '偏好'?this.state.color1:undefined
143+
titleColor:
144+
this.state.flag1 === '偏好' ? this.state.color1 : undefined,
145+
borderColor:
146+
this.state.flag1 === '偏好' ? this.state.color1 : undefined,,
124147
}}
125148
/>
126149
</Tabs>
@@ -139,6 +162,6 @@ const styles = StyleSheet.create({
139162
paddingRight: 20,
140163
},
141164
divider: {
142-
marginVertical: 10
143-
}
144-
});
165+
marginVertical: 10,
166+
},
167+
});

0 commit comments

Comments
 (0)