elementui の el-popover スタイルの変更が有効にならない問題の解決策

element-uiを使用する場合、el-popoverというよく使われるコンポーネントがありますが、element-uiの公式ドキュメントではスタイルと使用方法が比較的制限されており、使用時にスタイルを変更する必要があります。

私のプロジェクトでは el-popover を使用しましたが、スタイルを変更できませんでした。公式ドキュメントに何が書いてあるか見てみましょう。

クラス名、文字列型を追加して、OK、追加します

<el-popover
    配置="右"
    幅= "400"
    トリガー="ホバー"
    ポッパークラス="my-popover"
    >

スタイルを設定するには

<style lang="scss" スコープ>
	.my-popover{
		パディング:20px;
	}
</スタイル>

結果、設定は成功しませんでした！
スコープが原因ですか? スコープなしでもう一度試してください。

<スタイル>
マイポップオーバー{
    パディング:10px 30px;
}
</スタイル>

まだ効果なし！ ！ ！
クレイジーな実験とオンラインでの検索の末に！
最終的な記述方法は、.el-popover.my-popover です。プレフィックスは .el-popover です。そうしないと、有効になりません。スコープを絞ることはできない

<スタイル>
.el-popover.my-popover{
    パディング:10px 30px;
}
</スタイル>

変更に成功しました!

elementui の el-popover のスタイル変更が有効にならない問題の解決策に関するこの記事はこれで終わりです。el-popover のスタイルが有効にならない問題に関する関連コンテンツについては、123WORDPRESS.COM の以前の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。