Company logo
  • Jobs
  • Bootcamp
  • About Us
  • For professionals
    • Home
    • Jobs
    • Courses
    • Questions
    • Teachers
    • Bootcamp
  • For business
    • Home
    • Our process
    • Plans
    • Assessments
    • Payroll
    • Blog
    • Sales
    • Calculator

0

160
Views
React table v6, sorting number which is inside a div not working

Hi so I have three columns that I want to sort (instagram, twitter, facebook) these columns show the number of followers a user has on said platform.

Basically the problem is, the sorting works if I provide just a number, but I need to have that number wrapped in a div which is given an opaque class conditionally.

So my guess is react table looks at this as a string since the number is nested inside a div, see code below:

    instagram: (
      <div className={(prop[8] || prop[9]) && 'opaque'}>
        {Number(prop[3])}
      </div>
    ),
    twitter: (
      <div className={(prop[8] || prop[9]) && 'opaque'}>
        {Number(prop[5])}
      </div>
    ),
    facebook: (
      <div className={(prop[8] || prop[9]) && 'opaque'}>
        {Number(prop[7])}
      </div>
    ),

Please leave any suggestions at all below, I guess I need a custom sorting function? Also I'm using react table V6 as I'm using a creative tim package for my frontend and that's the only version that works with it.

7 months ago ยท Juan Pablo Isaza
Answer question
Find remote jobs