如何在 React Native 中显示列表中的多个选定项目
how to show multiple selected item from list in react native
列表中没有项目是 selected 但我想 select 所有三个标记的项目,我如何标记列表中的 selected 项目 =?
const List = [
{
options: [{ opt: 'a', oid: '1' }, { opt: 'b', oid: '2' }, { opt: 'c', oid: '3' }, { opt: 'd', oid: '4' },
],
marked: [1, 2, 3],
}
]
const [index, setIndex] = useState(0);
const qstn = List[index];
{qstn.options.map((x, id) =>
<Option
value={x.opt}
selected={qstn.marked === id} // here i am selecting items from marked
key={id}
/>
)}
export function Option({ value, selected }) {
return (
<TouchableWithoutFeedback>
<View style={styles.option}>
<View style={{ flex: 8, backgroundColor:selected? '#b8de6f' : '#fff' }}>
<Text style={{ fontSize: 15, fontFamily: 'OpenSans-Regular', }}>{value}</Text>
</View>
</View>
</TouchableWithoutFeedback>
)
}
selected={qstn.marked === id}
我认为你在这里犯了一个错误,因为 id 是一个数字,而 qstn.marked 是一个大批。如果您想检测该 id 是否在您的数组中,请将此行更改为 qstn.marked.indexOf(id) !== -1
.
列表中没有项目是 selected 但我想 select 所有三个标记的项目,我如何标记列表中的 selected 项目 =?
const List = [
{
options: [{ opt: 'a', oid: '1' }, { opt: 'b', oid: '2' }, { opt: 'c', oid: '3' }, { opt: 'd', oid: '4' },
],
marked: [1, 2, 3],
}
]
const [index, setIndex] = useState(0);
const qstn = List[index];
{qstn.options.map((x, id) =>
<Option
value={x.opt}
selected={qstn.marked === id} // here i am selecting items from marked
key={id}
/>
)}
export function Option({ value, selected }) {
return (
<TouchableWithoutFeedback>
<View style={styles.option}>
<View style={{ flex: 8, backgroundColor:selected? '#b8de6f' : '#fff' }}>
<Text style={{ fontSize: 15, fontFamily: 'OpenSans-Regular', }}>{value}</Text>
</View>
</View>
</TouchableWithoutFeedback>
)
}
selected={qstn.marked === id}
我认为你在这里犯了一个错误,因为 id 是一个数字,而 qstn.marked 是一个大批。如果您想检测该 id 是否在您的数组中,请将此行更改为 qstn.marked.indexOf(id) !== -1
.