React JS Duplicate object within array

Question

I have a "rails" array within my constructor which are imported components:

import MusicRail from '../../components/MusicRail';
import GamesRail from '../../components/GamesRail';
import MoviesRail from '../../components/MoviesRail';

constructor(props) {
   super(props);

   this.rails = [
      MusicRail,
     GamesRail,
     MoviesRail
  ]
}

How can I clone or duplicate the first and last objects to then push to the rails array? Can I use Object.assign() ?

I'm getting the first and last objects from the array like so:

const rails = this.rails;
const firstObject = this.rails[0];
const lastObject = this.rails.slice(-1)[0];

Littlee · Accepted Answer · 2018-09-19 10:29:33Z

1

Object.assign has nothing to do with Array (at least in this scenario), you may want to try this.

const rails = this.rails;
const firstObject = this.rails[0];
const lastObject = this.rails.slice(-1)[0];
this.rails = [...rails, firstObject, lastObject];

and if you're trying to build an infinite slider.

this.rails = [lastObject, ...rails, firstObject];

edited Sep 19, 2018 at 10:29

answered Sep 19, 2018 at 10:21

Littlee

4,3656 gold badges34 silver badges66 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Filth Over a year ago

This is great! So my last question is, how can I push the clone of the first item to be last and then the clone of the last item be first? I'm trying to build an infinite slider.

Manoz Over a year ago

@Littlee, Why not? Why Object.assign has nothing to do with Array?

Filth Over a year ago

Figured it out! Change the order of this.rails = [lastObject, ...rails, firstObject];

Filth Over a year ago

@Littlee Hey, I have a question - when I scroll to the last item which is a clone of the first in the array, I don't see the GamesRail after and so forth. You know like an infinite slider? Do you know how to go about this?

Littlee Over a year ago

@Filth try this github.com/akiran/react-slick, if implementing it from scratch takes too much time. You may post another question, cuz answering in comment can't provide much details 😂

Mosè Raguzzini · Accepted Answer · 2018-09-19 10:15:49Z

0

Use myArray.slice() or lodash method _.cloneDeep()

You can also use concat or spread operator:

let newArray = [
     ...arr
]

answered Sep 19, 2018 at 10:15

Mosè Raguzzini

15.9k1 gold badge34 silver badges46 bronze badges

Collectives™ on Stack Overflow

React JS Duplicate object within array

2 Answers 2

5 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related