Styjun

Why does Taylor’s series “work”?

Shortest amud or daf in Shas?

Is it possible to determine from only a photo of a cityscape whether it was taken close with wide angle or from a distance with zoom?

When did Britain learn about the American Declaration of Independence?

Prints each letter of a string in different colors. C#

Windows reverting changes made by Linux to FAT32 partion

How to customize the pie chart background in PowerPoint?

Why is Drogon so much better in battle than Rhaegal and Viserion?

What color to choose as "danger" if the main color of my app is red

Bookshelves: the intruder

Would a "ring language" be possible?

How can sister protect herself from impulse purchases with a credit card?

Why does string strummed with finger sound different from the one strummed with pick?

What technology would Dwarves need to forge titanium?

Why are stats in Angband written as 18/** instead of 19, 20...?

pwaS eht tirsf dna tasl setterl fo hace dorw

Is my company merging branches wrong?

Save my secrets!

How was the blinking terminal cursor invented?

Cathy’s Composite party is powered by three Prime Pals. Can you find them?

Can the Gate spell draw a creature larger that 20 feet in every dimension through the portal it creates?

How many Dothraki are left as of Game of Thrones S8E5?

Have GoT's showrunners reacted to the poor reception of the final season?

Physically unpleasant work environment

Rendering an array.map in React Native

Loop inside React JSXReact “after render” code?Set focus on input after renderHide keyboard in react-nativeReact js onClick can't pass value to methodWhat is the difference between using constructor vs getInitialState in React / React Native?What do these three dots in React do?Programmatically navigate using react routerWhat is the difference between React Native and React?Error Running React Native App From Terminal (iOS)

.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty height:90px;width:728px;box-sizing:border-box;

1

I am creating an app when using I generate many drawers to see how it is used I generate it with a

Array(400) .fill(info).map (info => return <AlbumBox info = info />)

Obtain the data of an object and pass it in the info variable to generate the drawers.
The structure is in another component only pass the data

Only in console is what is in the arrangement if I put it in a constant

`` `

render() {
 const info = 
 img: 'https://Beatles_-Abbey_Road.jpg',
 name: 'The Beatles - "Abbey Road',
 likes: 200,
 comments: 140,

const map = Array(1).fill(info).map(info =>
 return <AlbumBox info =info/>
)

console.warn(map)
return (

 <ScrollView style=styles.container>
 <AlbumBox info =info/>
 
 Array(500).fill(info).map(info =>
 return <AlbumBox info =info/>
 )
 
 </ScrollView>

);

` ``

The idea is that I generate on the screen the 500 drawers just sent that variable as a loop

javascript arrays reactjs react-native

share|improve this question

asked Mar 23 at 17:40

Drenniud BranchettDrenniud Branchett

213

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I'm afraid it's not at all clear what you're asking. It also seems odd to repeat the same object 500 times in an array, which is part of the confusion. What is your actual starting point, and what is your desired result, and where specifically are you stuck? Really want to help, but...
  
  – T.J. Crowder
  Mar 23 at 17:44
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  If you are right I am new to the use of react, it is only a small test using ScrollView and if I found information but only to react but not how to use it in React Native
  
  – Drenniud Branchett
  Mar 23 at 18:27
  

  
  
  
  

add a comment | 

1

I am creating an app when using I generate many drawers to see how it is used I generate it with a

Array(400) .fill(info).map (info => return <AlbumBox info = info />)

Obtain the data of an object and pass it in the info variable to generate the drawers.
The structure is in another component only pass the data

Only in console is what is in the arrangement if I put it in a constant

`` `

render() {
 const info = 
 img: 'https://Beatles_-Abbey_Road.jpg',
 name: 'The Beatles - "Abbey Road',
 likes: 200,
 comments: 140,

const map = Array(1).fill(info).map(info =>
 return <AlbumBox info =info/>
)

console.warn(map)
return (

 <ScrollView style=styles.container>
 <AlbumBox info =info/>
 
 Array(500).fill(info).map(info =>
 return <AlbumBox info =info/>
 )
 
 </ScrollView>

);

` ``

The idea is that I generate on the screen the 500 drawers just sent that variable as a loop

javascript arrays reactjs react-native

share|improve this question

asked Mar 23 at 17:40

Drenniud BranchettDrenniud Branchett

213

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I'm afraid it's not at all clear what you're asking. It also seems odd to repeat the same object 500 times in an array, which is part of the confusion. What is your actual starting point, and what is your desired result, and where specifically are you stuck? Really want to help, but...
  
  – T.J. Crowder
  Mar 23 at 17:44
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  If you are right I am new to the use of react, it is only a small test using ScrollView and if I found information but only to react but not how to use it in React Native
  
  – Drenniud Branchett
  Mar 23 at 18:27
  

  
  
  
  

add a comment | 

I am creating an app when using I generate many drawers to see how it is used I generate it with a

Array(400) .fill(info).map (info => return <AlbumBox info = info />)

Obtain the data of an object and pass it in the info variable to generate the drawers.
The structure is in another component only pass the data

Only in console is what is in the arrangement if I put it in a constant

`` `

render() {
 const info = 
 img: 'https://Beatles_-Abbey_Road.jpg',
 name: 'The Beatles - "Abbey Road',
 likes: 200,
 comments: 140,

const map = Array(1).fill(info).map(info =>
 return <AlbumBox info =info/>
)

console.warn(map)
return (

 <ScrollView style=styles.container>
 <AlbumBox info =info/>
 
 Array(500).fill(info).map(info =>
 return <AlbumBox info =info/>
 )
 
 </ScrollView>

);

` ``

The idea is that I generate on the screen the 500 drawers just sent that variable as a loop

javascript arrays reactjs react-native

share|improve this question

asked Mar 23 at 17:40

Drenniud BranchettDrenniud Branchett

213

Array(400) .fill(info).map (info => return <AlbumBox info = info />)

render() {
 const info = 
 img: 'https://Beatles_-Abbey_Road.jpg',
 name: 'The Beatles - "Abbey Road',
 likes: 200,
 comments: 140,

const map = Array(1).fill(info).map(info =>
 return <AlbumBox info =info/>
)

console.warn(map)
return (

 <ScrollView style=styles.container>
 <AlbumBox info =info/>
 
 Array(500).fill(info).map(info =>
 return <AlbumBox info =info/>
 )
 
 </ScrollView>

);

share|improve this question

asked Mar 23 at 17:40

Drenniud BranchettDrenniud Branchett

213

share|improve this question

asked Mar 23 at 17:40

Drenniud BranchettDrenniud Branchett

213

asked Mar 23 at 17:40

Drenniud BranchettDrenniud Branchett

213

asked Mar 23 at 17:40

Drenniud BranchettDrenniud Branchett

213

1 Answer
1

active

oldest

votes

-1

I tried the same thing only replaced your components with p for simplicity:

render() 
const info = 
 img: 'https://Beatles_-Abbey_Road.jpg',
 name: 'The Beatles - "Abbey Road',
 likes: 200,
 comments: 140,

return (
 <div>
 
 Array(500).fill(info).map(info => 
 return <p>info.name</p>
 )
 
 </div>
);

And its working fine here is the link to working example.
Also here is a perfectly working snack example of your code.

share|improve this answer

answered Mar 23 at 17:48

Muhammad Abdullah ShafiqMuhammad Abdullah Shafiq

602215

add a comment | 

Your Answer

StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");

StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);

else
createEditor();

);

function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);



);

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55316577%2frendering-an-array-map-in-react-native%23new-answer', 'question_page');

);

Post as a guest

Name

Email

Required, but never shown

-1

I tried the same thing only replaced your components with p for simplicity:

render() 
const info = 
 img: 'https://Beatles_-Abbey_Road.jpg',
 name: 'The Beatles - "Abbey Road',
 likes: 200,
 comments: 140,

return (
 <div>
 
 Array(500).fill(info).map(info => 
 return <p>info.name</p>
 )
 
 </div>
);

And its working fine here is the link to working example.
Also here is a perfectly working snack example of your code.

share|improve this answer

answered Mar 23 at 17:48

Muhammad Abdullah ShafiqMuhammad Abdullah Shafiq

602215

add a comment | 

-1

I tried the same thing only replaced your components with p for simplicity:

render() 
const info = 
 img: 'https://Beatles_-Abbey_Road.jpg',
 name: 'The Beatles - "Abbey Road',
 likes: 200,
 comments: 140,

return (
 <div>
 
 Array(500).fill(info).map(info => 
 return <p>info.name</p>
 )
 
 </div>
);

And its working fine here is the link to working example.
Also here is a perfectly working snack example of your code.

share|improve this answer

answered Mar 23 at 17:48

Muhammad Abdullah ShafiqMuhammad Abdullah Shafiq

602215

add a comment | 

I tried the same thing only replaced your components with p for simplicity:

render() 
const info = 
 img: 'https://Beatles_-Abbey_Road.jpg',
 name: 'The Beatles - "Abbey Road',
 likes: 200,
 comments: 140,

return (
 <div>
 
 Array(500).fill(info).map(info => 
 return <p>info.name</p>
 )
 
 </div>
);

And its working fine here is the link to working example.
Also here is a perfectly working snack example of your code.

share|improve this answer

answered Mar 23 at 17:48

Muhammad Abdullah ShafiqMuhammad Abdullah Shafiq

602215

render() 
const info = 
 img: 'https://Beatles_-Abbey_Road.jpg',
 name: 'The Beatles - "Abbey Road',
 likes: 200,
 comments: 140,

return (
 <div>
 
 Array(500).fill(info).map(info => 
 return <p>info.name</p>
 )
 
 </div>
);

share|improve this answer

answered Mar 23 at 17:48

Muhammad Abdullah ShafiqMuhammad Abdullah Shafiq

602215

answered Mar 23 at 17:48

Muhammad Abdullah ShafiqMuhammad Abdullah Shafiq

602215

answered Mar 23 at 17:48

Muhammad Abdullah ShafiqMuhammad Abdullah Shafiq

602215