Sass循环@mixin和@include

时间:2018-08-30 09:39:58

标签: css loops sass scss-mixins

我想创建这样的结构

    .nav-dropdown-items {
      .nav-link {
        padding-left: 1rem;
         .nav-dropdown-items {
           .nav-link {
              padding-left: 2rem;
              .....
            }
         }
      }
   }

这是我的SASS代码

@mixin generatePadding($counter, $i:1){
  @debug $i;
  @debug $counter;
  .nav-dropdown-items {
    .nav-link {
      padding-left: 1rem + $i;
      @if $i < $counter {
        @debug "include";
        @include generatePadding($counter, ($i+1)); // next iteration
      }
    }
  }
}

但是填充总是相同的(2rem)而不是2rem,3rem,4rem,...。

有人可以告诉我为什么吗?

1 个答案:

答案 0 :(得分:1)

我已经在https://www.sassmeister.com/中测试了您的代码,并刚刚添加了@include generatePadding(3);在它的结尾。结果是:

@Override
public void onReceive(Context context, Intent intent) {
    //Getting the phone state
    String state = intent.getStringExtra(TelephonyManager.EXTRA_STATE);

    if(state == null) return;

    //Getting the caller's number
    callerNumber = intent.getExtras().getString("incoming_number");

    if (state.equals(TelephonyManager.EXTRA_STATE_RINGING)) rang = true;
    if (state.equals(TelephonyManager.EXTRA_STATE_OFFHOOK)) callReceived = true;

    //if the phone is idle
    if (state.equals(TelephonyManager.EXTRA_STATE_IDLE)){
        if (ringing&&!callReceived){

            ringing = false;

           try{
               Toast.makeText(context, "Missed call", Toast.LENGTH_LONG).show();
           }catch (Exception e){
               e.printStackTrace();
           }
        }
        callReceived = false;
    }


}

一切似乎都很好。另外,请确保您的sass编译器正常工作。