尝试渲染部分列表时出错
2021-01-09
827
我尝试渲染
SectionList
,但它返回了三个错误:
Uncaught TypeError: Cannot read property 'length' of undefined
The above error occurred in the <VirtualizedSectionList> component:
Uncaught TypeError: Cannot read property 'length' of undefined
SectionList
的代码数据:
const {data, esporte, quantidadeTimes} = route.params;
function embaralhar(array) {
for (let i = array.length - 1; i > 0; i--) {
const j = Math.floor(Math.random() * (i + 1));
[array[i], array[j]] = [array[j], array[i]];
}
}
function separarTimes(arr, tamanho) {
var novoArray = [];
var i = 0;
var numeroTime = 1;
while (i < arr.length) {
novoArray.push({title: "Time "+ numeroTime, nomes: arr.slice(i, i + tamanho), });
numeroTime += 1;
i += tamanho;
}
return novoArray;
}
const dataEmbaralhada = embaralhar(data);
const timesSeparados = separarTimes(dataEmbaralhada, Math.trunc(data.length/quantidadeTimes))
示例
timesSeparados
:
[
{
title: "Time 1",
nomes: [
{
nome: "Nome1",
nivelId: 4,
isGoleiro: false,
id: 0
},
{
nome: "Nome2",
nivelId: 0,
isGoleiro: false,
id: 1
},
{
nome: "Nome3",
nivelId: 2,
isGoleiro: true,
id: 2
},
]
},
{
title: "Time 2",
nomes: [
{
nome: "Nome1",
nivelId: 4,
isGoleiro: false,
id: 0
},
{
nome: "Nome2",
nivelId: 0,
isGoleiro: false,
id: 1
},
{
nome: "Nome3",
nivelId: 2,
isGoleiro: true,
id: 2
},
]
}
]
代码
SectionList
:
<ListaNomes
renderItem={renderItem}
renderSectionHeader={({section: {title}}) => (
<Text style={{fontWeight: 'bold'}}>{title}</Text>
)}
sections={timesSeparados}
keyExtractor={(item, index) => item + index}
/>
代码渲染项:
const renderItem = ({item}) => {
return (
<NomeItemContainer>
<Nome>
{item.nomes.nome}
</Nome>
<Infos>
<Nivel>
{item.nomes.nivelId}
</Nivel>
{
item.nomes.goleiro === true
? <MaterialIcons name="pan-tool" size={20} color="white" style={{paddingRight: 5}}/>
: <Nome></Nome>
}
</Infos>
</NomeItemContainer>
);
}
2个回答
看来您正在尝试在此行中传递一系列数据
489915609
期望一个数组,但在
section> sectionlist
const {data,eSporte,dentIdAdetimes} = route.params;
您已经破坏了
data
,这些
可能不存在于<代码> rout.params
,它以
embaralhar
函数作为
undefined
函数,然后您尝试通过该
undefined
在
embaralhar
函数中,我假设要扔
无法读取未定义的
的属性“长度”。另外,另一个原因可能是从
embaralhar
返回。由于
Syparatimes
也取决于
数据
它也会因相同的原因而破裂。此外,据我所知,不可能在
route.params
中传递数组,也不是一个好主意。尝试以其他方式提取数据。如
props
或使用
上下文API
。希望这会有所帮助。尝试一下。
Md.Reyad Hossain
2021-01-09
您正在阅读
const dataEmbaralhada = embaralhar(data);
但您的
embaralhar
函数未返回任何内容
Danny
2021-01-09