0

I am new to React and got stuck on this silly thing,

I have a component named in which i am passing few props

<VideoDetail
    video={this.state.selectedVideo}
    viewCount={this.state.selectedViewCount}
/>

and i need to format the viewCount

const VideoDetail = ({video,viewCount}) => {
    return (
        <p className="views"><i className="material-icons">remove_red_eye</i>{viewCount}</p>
    );
};

I know how to format the string as my requirement in JS but how will I use that here in viewCount or is there any other way?

P.S. if the viewCount comes as 10944431, i need to format it into 10,944,431

Update: Sorry, but i had already told that I know how to format in JS, so i think it's not duplicate but instead is that viewCount's type String?

Aman Kumar
  • 480
  • 2
  • 7
  • 21
  • 1
    Possible duplicate of [How to print a number with commas as thousands separators in JavaScript](https://stackoverflow.com/questions/2901102/how-to-print-a-number-with-commas-as-thousands-separators-in-javascript) – Tomasz Mularczyk May 31 '18 at 06:40

1 Answers1

1

How to print a number with commas as thousands separators in JavaScript

Applied here:

const VideoDetail = ({video,viewCount}) => {
    return (
        <p className="views">
          <i className="material-icons">
            remove_red_eye
          </i>

          {viewCount.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}
       </p>
    );
};
Joshua Robinson
  • 3,430
  • 1
  • 27
  • 35
  • Thanks @Joshua for the answer, the thing which i was unclear about was that the type of viewCount is string and clarifying that clears the things. – Aman Kumar May 31 '18 at 07:09