• ベストアンサー
※ ChatGPTを利用し、要約された質問です(原文:@mixinの繰り返し生成について)

@mixinの繰り返し生成について

このQ&Aのポイント
  • ミックスインを繰り返し文を使用して自動的に生成する方法について教えてください。
  • 提供されたコードではエラーが発生しているようですが、他の方法でミックスインを自動生成することは可能でしょうか?
  • また、ミックスインを大量に作成して全てシングルトン構成にする理由についても教えてください。

質問者が選んだベストアンサー

  • ベストアンサー
回答No.1

現状では無理なようですね。 >※また、なぜmixinを自動生成するのかというと、mixinを大量に作成し、全てシングルトン構成にしたいからです。 たぶん @include test1; @include test2; という書き方をしたいということだと思いますが、 @include test(1); @include test(2); カッコ付の方が基本ですし、その方が汎用性がありますし、 よほどの理由がない限り、動的にmixinのIDを作る方法はサポートされないと思います。 ------------------ 連番のセレクタを作りたいのであれば、@includeをループさせればいいです。 引数をセレクタにすれば、子セレクタなども作れます。 @mixin test($i) { .test#{$i} { /* style */ } } @for $i from 1 through 5 { @include test( $i ); } @include test( " span" ); ---- 出力 ---- .test1{/* style */} .test2{/* style */} .test3{/* style */} .test4{/* style */} .test5{/* style */} .test span{/* style */}

javat8686
質問者

お礼

これ以上ない様な回答ありがとうございます。 >@include test1; >@include test2; >という書き方をしたいということだと思いますが、 まさにこれです。 やはり現状できないのですね、 @for $i from 1 through length($colorArray) { .back-color#{$i} { @include backColor(#{nth($colorArray,$i)}); } } ↑のようにしているのですが、 使うものだけクラスの生成をしたかったのです、 これだと、配列に入った値の全てのクラスを作ってしまうので・・・ なにかそれに変わるような方法の発見、もしくは機能が追加されればいいのですが。

その他の回答 (1)

回答No.2

>No.1お礼 よくわかりませんが、それは$colorArrayを調整すべき事ではないですかね。 でなければ@mixin backColorの中身、つまり @mixin backColor( $colorName ){ この部分 } で調整できると思いますが。

関連するQ&A

専門家に質問してみよう