arrays - 如何实施
我在数组中使用 <List.Accordion 时遇到了一些困难。我想在打开时更改标题颜色。跟随有错误的零食。
https://snack.expo
问问题
850 次
2 回答
1
import React, { useState } from 'react';
import { List } from 'react-native-paper';
import { View, Text, ScrollView } from 'react-native';
const DropDownComponent = () => {
const [expanded, setExpanded] = useState(true);
const [selectedItem, setSelectedItem] = useState('');
const items = [
{ id: 1, name: 'Apple' },
{ id: 2, name: 'Banana' },
{ id: 3, name: 'Orange' },
];
const handlePress = () => {
setExpanded(!expanded);
};
return (
<View>
<List.Section title="List of Items">
<ScrollView>
<List.Accordion
title={selectedItem}
expanded={expanded}
onPress={handlePress}>
{items.map((item) => (
<List.Item
onPress={() => {
setSelectedItem(item.name);
setExpanded(!expanded);
}}
title={item.name}
/>
))}
</List.Accordion>
</ScrollView>
</List.Section>
</View>
);
};
于 2021-12-21T04:21:39.677 回答
0
这是一种实现数组数据的方法。
render = () => {
if (this.state.Data) {
let uiItems = [];
for (const obj of this.state.Data) {
uiItems.push(
<List.Section >
<List.Accordion
title={obj.Title}
left={(props) => <List.Icon {...props} icon="folder" />}>
<List.Item title={obj.Description} descriptionNumberOfLines={16}/>
</List.Accordion>
</List.Section>,
);
}
return uiItems;
} else {
return null;
}
};
render() {
{
return (
<View style={{flex: 1}}>
{this.render()}
</View>
);
}
}
于 2020-10-11T18:34:35.883 回答
我在数组中使用 <List.Accordion 时遇到了一些困难。我想在打开时更改标题颜色。跟随有错误的零食。 https://snack.expo
问问题
850 次
2 回答
1
import React, { useState } from 'react';
import { List } from 'react-native-paper';
import { View, Text, ScrollView } from 'react-native';
const DropDownComponent = () => {
const [expanded, setExpanded] = useState(true);
const [selectedItem, setSelectedItem] = useState('');
const items = [
{ id: 1, name: 'Apple' },
{ id: 2, name: 'Banana' },
{ id: 3, name: 'Orange' },
];
const handlePress = () => {
setExpanded(!expanded);
};
return (
<View>
<List.Section title="List of Items">
<ScrollView>
<List.Accordion
title={selectedItem}
expanded={expanded}
onPress={handlePress}>
{items.map((item) => (
<List.Item
onPress={() => {
setSelectedItem(item.name);
setExpanded(!expanded);
}}
title={item.name}
/>
))}
</List.Accordion>
</ScrollView>
</List.Section>
</View>
);
};
于 2021-12-21T04:21:39.677 回答
0
这是一种实现数组数据的方法。
render = () => {
if (this.state.Data) {
let uiItems = [];
for (const obj of this.state.Data) {
uiItems.push(
<List.Section >
<List.Accordion
title={obj.Title}
left={(props) => <List.Icon {...props} icon="folder" />}>
<List.Item title={obj.Description} descriptionNumberOfLines={16}/>
</List.Accordion>
</List.Section>,
);
}
return uiItems;
} else {
return null;
}
};
render() {
{
return (
<View style={{flex: 1}}>
{this.render()}
</View>
);
}
}
于 2020-10-11T18:34:35.883 回答