错误类型:TypeError:未定义的不是函数。为什么我的对象不能转换为数组?

huangapple go评论107阅读模式
英文:

ERROR TypeError: undefined is not a function Why my object is not converting to array?

问题

ERROR TypeError: undefined is not a function 为什么我的对象无法转换为数组?这是我面临的错误,我试图映射当前为对象的所有项目,但我想将它们转换为数组以进行映射,我该如何做到这一点?它尚未转换为数组,我尝试了一些互联网上的解决方案,我该如何做到这一点?

Currenlty其给我null,当我首次使用const propertyValues = Object.values(item);时,它给我了ERROR TypeError:undefined is not a function错误

const renderImages = ({ item, index }) => {
console.log(item)
if (!item || !Array.isArray(item)) {
return null;
}

const propertyValues = Object.values(item);
console.log(propertyValues);

return (
<View style={styles.images}>
{item.map((url) => (
<Image key={url} style={styles.pic} source={{ uri: url }} />
))}
</View>
);
};

如果我什么都不做,只是记录item,它会记录类似这样的东西:

LOG {"picture": "https://firebasestorage.googleapis.com/v0/b/myprojectfirebase.appspot.com/o/file%3A%2Fdata%2Fuser%2F0%2Fhost.exp.exponent%2Fcache%2FExperienceData%2F%252540anonymous%25252FYounme-4dc528f7-0647-403c-9671-6a595b71bf0b%2FImagePicker%2Fba5eb500-c4e3-4199-9cef-5a8bfb3b1219.jpeg?alt=media&token=49041038-deef-40d9-9809-41210982ae36"}

{
userdata ?
<FlashList
data={userdata.pictures}
renderItem={renderImages}
keyExtractor={(item, index) => index.toString()}
getItemCount={() => userdata.pictures.length}
getItem={(data, index) => data[index]}
initialNumToRender={5}
windowSize={5}
ListHeaderComponent={
...//
}
}
/>

英文:

ERROR TypeError: undefined is not a function Why my object is not converting to array? this is the error that I am facing I am trying to map all the item which is currently object but I want to convert it to array to map all them how can I do that? its not been converted into array I tried some solutions on internet how can I do that?

Currenlty its giving me null and when i first const propertyValues = Object.values(item); it gave me ERROR TypeError: undefined is not a function error

  1. const renderImages = ({ item, index }) =&gt; {
  2. console.log(item)
  3. if (!item || !Array.isArray(item)) {
  4. return null;
  5. }
  6. const propertyValues = Object.values(item);
  7. console.log(propertyValues);
  8. return (
  9. &lt;View style={styles.images}&gt;
  10. {item.map((url) =&gt; (
  11. &lt;Image key={url} style={styles.pic} source={{ uri: url }} /&gt;
  12. ))}
  13. &lt;/View&gt;
  14. );
  15. };

If i do nothing just log the item it logs something like this:

  1. LOG {&quot;picture&quot;: &quot;https://firebasestorage.googleapis.com/v0/b/myprojectfirebase.appspot.com/o/file%3A%2Fdata%2Fuser%2F0%2Fhost.exp.exponent%2Fcache%2FExperienceData%2F%252540anonymous%25252FYounme-4dc528f7-0647-403c-9671-6a595b71bf0b%2FImagePicker%2Fba5eb500-c4e3-4199-9cef-5a8bfb3b1219.jpeg?alt=media&amp;token=49041038-deef-40d9-9809-41210982ae36&quot;}
  2. {
  3. userdata ?
  4. &lt;FlashList
  5. data={userdata.pictures}
  6. renderItem={renderImages}
  7. keyExtractor={(item, index) =&gt; index.toString()}
  8. getItemCount={() =&gt; userdata.pictures.length}
  9. getItem={(data, index) =&gt; data[index]}
  10. initialNumToRender={5}
  11. windowSize={5}
  12. ListHeaderComponent={
  13. ...//
  14. }
  15. }
  16. /&gt;

答案1

得分: 1

如果item是一个对象,此代码将始终返回null

  1. if (!item || !Array.isArray(item)) {
  2. return null;
  3. }

此外,如果你想创建一个URL数组,你可以简单地使用Object.keys.map来创建一个item URL 数组。

  1. const properties = Object.keys(item);
  2. const values = properties.map((p) => item[p].url);

由于item只有一个picture,为什么不简化:

  1. const renderImages = ({ item, index }) => {
  2. return (
  3. <View style={styles.images}>
  4. <Image key={item.picture} style={styles.pic} source={{ uri: item.picture }} />
  5. </View>
  6. );
  7. };
英文:

If item is an object, this code will always return null:

  1. if (!item || !Array.isArray(item)) {
  2. return null;
  3. }

Additionally, if you want to create an array of URLs, you can simply use Object.keys and .map to create an array of item urls.

  1. const properties = Object.keys(item);
  2. const values = properties.map((p) =&gt; item

    .url);

Since item just has one picture, why not simplify:

  1. const renderImages = ({ item, index }) =&gt; {
  2. return (
  3. &lt;View style={styles.images}&gt;
  4. &lt;Image key={item.picture} style={styles.pic} source={{ uri: item.picture }} /&gt;
  5. &lt;/View&gt;
  6. );
  7. };

答案2

得分: 1

  1. 考虑执行
  2. const renderImages = ({ item, index }) => {
  3. return (
  4. <View style={styles.images}>
  5. <Image key={url.picture} style={styles.pic} source={{ uri: url.picture }} />
  6. </View>
  7. );
  8. };
英文:

Consider doing:

  1. const renderImages = ({ item, index }) =&gt; {
  2. return (
  3. &lt;View style={styles.images}&gt;
  4. &lt;Image key={url.picture} style={styles.pic} source={{ uri: url.picture }} /&gt;
  5. &lt;/View&gt;
  6. );
  7. };

huangapple
  • 本文由 发表于 2023年2月18日 23:30:36
  • 转载请务必保留本文链接:https://go.coder-hub.com/75494376.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定