ブートストラップ テーブルでの行分割: ブートストラップ テーブルで行分割を実装するためのガイド

Question

テーブル内の配列に .join() を作成しようとしています。期待される結果は、各車両 (以下の例) が一列に並んでいることです。

.join("\r\n") と .join("<br />") を使用してみましたが、うまくいきません。私は何を取りこぼしたか？

リーリー リーリー

上記と同じコード スニペットですが、CodePen 上にあります。

Answer 1

(例のようにボタンをクリックした直後ではなく) 常に別の行に配置したいと仮定すると、<b-table> で提供されるスロットを使用してカスタマイズできます。列のコンテンツを抽出し、単純な v-for を使用して各要素を独自の <div> にレンダリングします。

リーリー リーリー

Answer 2

あなたが見ている問題は、コンテンツが解釈されず、テキストとして表示されることです。これを調整するには、cell(key) スロットを使用します。次に、スロットで v-html を使用して文字列を html として解釈します。

リーリー リーリー