反応ブートストラップテーブルのページングスタイルを変更する方法はありますか？

Question

react-bootstrap-tableのページング行のデフォルトのスタイリングでは、ブートストラップグリッド列のサイジングクラス名（「col-xs-6」など）が使用されます。私たちはデフォルト（12ではなく60）の異なるサイズのグリッドを使用しているので、ページ区切り要素は左端の小さな列に押しつぶされてしまいます。

クラス名を "col-xs-30"に設定すると、問題が解決されます。しかし、私はページングスタイルを調整するオプションはありません。

ページネーション要素を完全にカスタムでレンダリングする方法があります。それは私の唯一の選択肢ですか？オリジナルをコピーして、サイズを変更するだけですか？

Answer 1

documentation for paginationが表示されている場合は、これがグリッドのページ設定を調整するユニークな方法と思われます。 （ここではカスタム改ページセクションを参照してください）

はこのように述べ、あなたは常に改ページ要素の上位クラスを使用することができ、それはあるは-BS-テーブル - 改ページを反応させておらず、この点からCSSを上書きする、これ何があります反応ブートストラップテーブルオプションをフックして、独自のクラスをページネーションに追加します。

<div class="react-bs-table-pagination"> 
    <div class="row" style="margin-top: 15px;"> 
     <div> 
      <div class="col-md-6 col-xs-6 col-sm-6 col-lg-6"> 
       <span class="dropdown react-bs-table-sizePerPage-dropdown" style="visibility: visible;"> 

        <!-- ... --> 
        <!-- DROPDOWN CODE --> 
        <!-- ... --> 

       </span> 
      </div> 
      <div class="col-md-6 col-xs-6 col-sm-6 col-lg-6" style="display: block;"> 
       <ul class="react-bootstrap-table-page-btns-ul pagination"> 

        <!-- ... --> 
        <!-- PAGINATION ELEMENT CODE --> 
        <!-- ... --> 

       </ul> 
      </div> 
     </div> 
    </div> 
</div>