React-Bootstrapコンポーネントの小道具としてパディング/マージンを渡す方法

Question

PropsとしてReact-Bootstrapを使って余白やパディングを適用しようとしています。

私は docs から渡しましたが、そこにパディングやマージンの追加が公式bootstrap docs（ th および - 4th ）。私はそれがうまくサポートされていないことを知っていますBootstrap 4が、両方で試してみました。

パラメータをp={1}、paddingxs={5}またはmt='1'として渡しようとしましたが、それらのいずれも認識されません。 React-BootStrapフォルダの間隔の要素を見つけようとしましたが、失敗しました。

パディングとマージンはクラス名として機能します。しかし、Bootstrapクラスなしでそれを手に入れるべきであると思います。一種の財産が必要です。

Answer 1

デフォルトのReactスタイルを使用して、余白とパディングを追加できます。

const divStyle = {
  marginLeft: '10px',
};

function HelloWorldComponent() {
  return <div style={divStyle}>Hello World!</div>;
}

ここで から参照されます

Answer 2

要素にclassname = "p-5"を追加する必要があります。これはReact-BootStrapには文書化されていませんが、オリジナルのBootstrap 4ドキュメントにあります。 https://getbootstrap.com/docs/4.4/utilities/spacing/##amples