How to place a toolbar at bottom when its in a tab in react?

I have a toolbar inside tab and I want to place it at bottom, I tried and bottomMd=“true”\ and toolbar-bottom-md for toolbar but no work, when its in a indepentdent page it works but doesnt work when inside a tab

        <Toolbar tabbar bottomMd={this.state.toolbarBottom}>
          <Link tabLink="#tab-1" tabLinkActive>TAB1</Link>
          <Link tabLink="#tab-2">TAB2</Link>
          <Link tabLink="#tab-3">TAB3</Link>
        </Toolbar>

        <Tabs swipeable>
          <Tab id="tab-1" className="page-content" tabActive>
        <Toolbar bottomMd>
          <Link>
          <Icon md="material:person_add"></Icon></Link>
          <Link>
          <Icon md="material:volume_up"></Icon></Link>          
          <Link>
          <Icon md="material:phone_paused"></Icon></Link>
          <Link>
          <Icon md="material:mic_off"></Icon></Link>
        </Toolbar>

It is valid statement. It is not allowed to use f7-page inside of f7-page. Only one f7-page tag must be used in single components. Exception only for the case when you have “inline” modals (like popup) that can be inside of page and can contain page as well

Did not worked for react. when I put another page inside tab id doesnt work.