0

React Toolboxをいじっていて、コンポーネントが非常に大きくレンダリングされていることに気付きました (見逃すことはありません)。次に例を示します。

ここに画像の説明を入力

ツールバーの高さがかなり大きく、それらのチェックボックス..まあ..私が欠けているものはありますか? React Toolbox を使用するのはこれが初めてです。

これがLayoutコンポーネントと関係があるかどうかはわかりませんか？こちらのドキュメントで確認できます。これらの派手なブレークポイントがすべてどのようにあるのかを説明し続けていますが、実際にそれらを実装して操作する方法がわかりません。

4

1 に答える 1

1

「何か足りないものはありますか？」

いいえ、心配する必要はありません:)

パッケージで定義されているように、 react-toolboxコンポーネントのデフォルト スタイルが表示されているだけです。

中を見てくださいnode_modules/react-toolbox/lib/。あなたのsass-loaderin はwebpack.config.jsそれらのスタイルをコンパイルして注入します（node_modules明示的に除外されていないため）。

ただし、もちろん、プロジェクトで独自のまたはファイルを定義することにより、これらのデフォルト スタイルをオーバーライドできます。.scss.css

すべてのコンポーネントreact-toolboxはプロパティを受け入れますclassName。

つまり、できる

styles.css (.scssもっと好きなら一緒に行ってください)

.myCustomInput {
    font-size: 10px;
    height: 12px;
    background-color: #ccc;
    padding: 3px 5px;
}

AddToDo.js

import { Input } from 'react-toolbox';
import styles from './styles.css'; 

...

<Input className={styles.myCustomInput} />
于 2016-11-26T08:21:12.780 に答える