1

Choice Groupラジオ ボタンにOffice ファブリックを使用しています。テキストの一部のスタイルを に変更したいのですboldが、残りのテキストは通常​​のフォント サイズのままです。私はonRenderFieldメソッドを使用していますが、まだ実装に成功していません....ご意見をお寄せいただきありがとうございます!!

ラジオ ボタン テキストの最終目標:

オン:ここに追加の説明があります

メソッドを使用したコード例onRenderField:

options={[
  {
    key: 'On', 
    text: 'On: some additional explanation here', 
    onRenderField: (props, render) => {
      return (
        <span style={{fontWeight: 'bold'}}>
          {render!(props)}
        </span>
      );
    }
  }
]}

上記のコードはbold全体textを以下のようにします:

オン: ここに追加の説明があります

4

1 に答える 1

1

十分に文書化されていないように見えるオプションがあり、onRenderLabel必要なことを実行します。

使用すると次のようになります。

{
  key: 'C',
  text: 'Option C',
  onRenderLabel: (p) => <span id={p.labelId} className="ms-ChoiceFieldLabel">Option C: only <strong>this part</strong> is bold</span>
}

コールバック内のpはタイプIChoiceGroupOptionPropsであり、使用できる可能性がありますが、レンダリング全体をインラインで定義する方が簡単である可能性が高くなります。( https://docs.microsoft.com/en-us/javascript/api/office-ui-fabric-react/ichoicegroupoptionprops?view=office-ui-fabric-react-latest )

于 2020-06-02T22:21:10.603 に答える