@ej-hooks/use-tabs

    1.0.1 • Public • Published

    @ej-hooks/use-tabs

    React Hook to switch sections with tabs.

    Installation

    yarn

    yarn add @ej-hooks/use-tabs

    npm

    npm i @ej-hooks/use-tabs

    Usage

    import React from 'react';
    import useTabs from '@ej-hooks/use-tabs';
    
    const content = [
      {
        tab: "Section 1",
        content: "I'm the content of the Section 1"
      },
      {
        tab: "Section 2",
        content: "I'm the content of the Section 2"
      }
    ];
    
    function App() {
      const { currentItem, changeItem } = useTabs(0, content);
      return (
        {content.map((section, index) => (
          <button onClick={() => changeItem(index)}>{section.tab}</button>
        ))}
        <div>{currentItem.content}</div>
      );
    }

    Arguments

    Argument Type Description Required
    initialTab number Initial index value yes
    allTabs array Content array yes

    Return

    Return value Type Description Default value
    currentItem object An object containing the content of index allTabs[currentIndex]
    changeItem function Function to change the index to current index setCurrentIndex

    Install

    npm i @ej-hooks/use-tabs

    DownloadsWeekly Downloads

    0

    Version

    1.0.1

    License

    MIT

    Unpacked Size

    2.33 kB

    Total Files

    4

    Last publish

    Collaborators

    • eunjinfizz