Javascript Lesscss-当一个数字没有单位时

我如何检查一个数字是否没有包含更少的单位？ 必须有一条短于：

.margin(@i) when (isnumber(@i)) and not (ispixel(@i)) and not (ispercentage(@i)) and not (isem(@i)) and not (isunit(@i,rem)) and not (@i = auto) {
  ...
}

我原以为

当没有的时候（isunit（@I））

会起作用，但这不起作用

我的目标是使用默认单位，并尽可能多地使用诸如“.font size（10）”之类的无单位函数。只有当值没有单位时才应使用默认单位，如果它有“.font size（2em）”这样的单位，则值保留其单位。当默认单位为“rem”或使用rem作为单位时，函数必须在rem属性（旧浏览器）之前添加像素值，并计算rem值：

“.font size（5）”应输出：（当@default unit:rem时）

我已将其与以下功能完全配合使用：

.font-size(@i) when (isunit(@i,rem)) {
  font-size: unit(@i*10,px);
  font-size: @i;
}

.font-size(@i) when (ispixel(@i)), (ispercentage(@i)), (isem(@i)), (@i = auto) and not (isunit(@i,rem)) and not (@i = n) {
  font-size: @i;
}

.font-size(@i) when not (ispixel(@i)) and not (ispercentage(@i)) and not (isem(@i)) and not (isunit(@i,rem)) and not (@i = auto) and (@unit = rem) and not (@i = n) {
  font-size: unit(@i,px);
  font-size: unit(@i/10,rem);
}

.font-size(@i) when not (ispixel(@i)) and not (ispercentage(@i)) and not (isem(@i)) and not (isunit(@i,rem)) and not (@i = auto) and not (@unit = rem) and not (@i = n) {
  font-size: unit(@i,px);
}

只是看起来我想要达到的目标有点过分。。。这个能短一点吗

编辑：Scotts的答案正是我想要的，现在当我不想使用“.margin（5,10,0,8px）”这样的4个值时，我调用了所需的4个函数：.margin-top（），.margin-right（），…“这就像它应该的那样工作，但是呈现的css相当长……我想知道呈现css的最佳方式是什么：“margin:0.5rem，1rem，0,8px；“。使用Scotts函数，我尝试为2个值制作一个示例：

.background-position(@x,@y) {

  .runChecksx() when not (isnumber(@x)) {
    @baseOutputx: @x;
  }
  .runChecksx() when (isnumber(@x)) {
    @tempbaseOutputx: (@x * unit(1, @unit));
    @passedRemx: isunit(@x, 'rem');
    .checkRemx() when not (isunit(@tempbaseOutputx, 'rem')) and not (@passedRemx) {
      @baseOutputx: (@x * unit(1, @unit));
    }
    .checkRemx() when (isunit(@tempbaseOutputx, 'rem')), (@passedRemx) {
      @remBaseAdjx: unit(`(('@{unit}' == 'rem' & @{passedRemx} == true) ? 1 : 0.1)`);
      @baseOutputx: unit((@x * @remBaseAdjx), rem);
    }
    .checkRemx();
  }


  .runChecksy() when not (isnumber(@y)) {
    @baseOutputy: @y;
  }
  .runChecksy() when (isnumber(@y)) {
    @tempbaseOutputy: (@y * unit(1, @unit));
    @passedRemy: isunit(@y, 'rem');
    .checkRemy() when not (isunit(@tempbaseOutputy, 'rem')) and not (@passedRemy) {
      @baseOutputy: (@y * unit(1, @unit));
    }
    .checkRemy() when (isunit(@tempbaseOutputy, 'rem')), (@passedRemy) {
      @remBaseAdjy: unit(`(('@{unit}' == 'rem' & @{passedRemy} == true) ? 1 : 0.1)`);
      @baseOutputy: unit((@y * @remBaseAdjy), rem);
    }
    .checkRemy();
  }


  .runChecksx();
  .runChecksy();


  .checkFallback() when (isunit(@baseOutputx,rem)) and (isunit(@baseOutputy,rem)) {
      background-position: @baseOutputx*10px @baseOutputy*10px;
  }
  .checkFallback() when (isunit(@baseOutputx,rem)) and not (isunit(@baseOutputy,rem)) {
      background-position: @baseOutputx*10px @baseOutputy;
  }
  .checkFallback() when not (isunit(@baseOutputx,rem)) and (isunit(@baseOutputy,rem)) {
      background-position: @baseOutputx @baseOutputy*10px;
  }
  .checkFallback() when not (isunit(@baseOutputx,rem)) and not (isunit(@baseOutputy,rem)) { }

  .checkFallback();

  background-position: @baseOutputx @baseOutputy;
}

使用4个值将使此函数非常小，有更好的方法吗？

更新：字体大小 这在将来可能会减少一些，但是在当前（1.4.1）版本的LESS中，

rem

值肯定存在一个bug。仍然有相当多的代码，但所有内容都包含在最初的mixin调用中

LESS（默认单位为

rem

set的测试用例）

@defaultUnit:rem；
.setFontSize（@i）{
.runChecks（）如果不是（isnumber（@i））{
@基本输出：@i；
}
.runChecks（）当（isnumber（@i））{
@tempBaseOutput:（@i*unit（1，@defaultUnit））；
@passedRem:isunit（@i，'rem'）；//一个带有rem的bug需要这个额外的步骤
.checkRem（）当不是时（isunit（@tempBaseOutput，'rem'））和不是（@passedRem）{
//以非rem单位传递，或在非rem时设置为默认值
@基本输出：（@i*unit（1，@defaultUnit））；
}
.checkRem（）当（isunit（@tempBaseOutput，'rem'），（@passedRem）{
//保持以rem单位和值传递
//或设置为默认rem单位，但使用传递值作为px值
@remBaseAdj:unit（`（'{defaultUnit}'='rem'&{passedRem}==true）？1:0.1`）；
@基本输出：单位（（@i*@remBaseAdj），rem）；
字体大小：单位（@i，px）*（10*@remBaseAdj）；
}
.checkRem（）；
}
.runChecks（）；
字号：@baseOutput；
}
.test1{
.setFontSize（5）；
}
.test2{
.setFontSize（5雷姆）；
}
.test3{
.setFontSize（5px）；
}
.test4{
.setFontSize（5%）；
}
.test5{
.setFontSize（5em）；
}
.test6{
.setFontSize（继承）；
}

CSS输出

.test1{/*即带有rem默认单位的无单位5*/
字号：5px；
字体大小：0.5rem；
}
.test2{/*即传入rem值*/
字体大小：50px；
字体大小：5rem；
}
.test3{
字号：5px；
}
.test4{
字体大小：5%；
}
.test5{
字号：5em；
}
.test6{/*任何字符串*/
字体大小：继承；
}

我不确定native LESS对此是否有一个简单的答案，但我确实有一个问题，就是您具体想对这些信息做什么。您是否试图添加一个单位，但仅当传递的值是一个数字但没有自己的单位时？

isunit

没有按照您想要的方式工作，因为它需要第二个参数that定义了一个特定的单位。编辑了我的帖子，明确了我想要达到的目标…谢谢！也许将来我们可以使用一个变量作为属性，比如“setSize（左边距，10）；"

.background-position(@x,@y) {

  .runChecksx() when not (isnumber(@x)) {
    @baseOutputx: @x;
  }
  .runChecksx() when (isnumber(@x)) {
    @tempbaseOutputx: (@x * unit(1, @unit));
    @passedRemx: isunit(@x, 'rem');
    .checkRemx() when not (isunit(@tempbaseOutputx, 'rem')) and not (@passedRemx) {
      @baseOutputx: (@x * unit(1, @unit));
    }
    .checkRemx() when (isunit(@tempbaseOutputx, 'rem')), (@passedRemx) {
      @remBaseAdjx: unit(`(('@{unit}' == 'rem' & @{passedRemx} == true) ? 1 : 0.1)`);
      @baseOutputx: unit((@x * @remBaseAdjx), rem);
    }
    .checkRemx();
  }


  .runChecksy() when not (isnumber(@y)) {
    @baseOutputy: @y;
  }
  .runChecksy() when (isnumber(@y)) {
    @tempbaseOutputy: (@y * unit(1, @unit));
    @passedRemy: isunit(@y, 'rem');
    .checkRemy() when not (isunit(@tempbaseOutputy, 'rem')) and not (@passedRemy) {
      @baseOutputy: (@y * unit(1, @unit));
    }
    .checkRemy() when (isunit(@tempbaseOutputy, 'rem')), (@passedRemy) {
      @remBaseAdjy: unit(`(('@{unit}' == 'rem' & @{passedRemy} == true) ? 1 : 0.1)`);
      @baseOutputy: unit((@y * @remBaseAdjy), rem);
    }
    .checkRemy();
  }


  .runChecksx();
  .runChecksy();


  .checkFallback() when (isunit(@baseOutputx,rem)) and (isunit(@baseOutputy,rem)) {
      background-position: @baseOutputx*10px @baseOutputy*10px;
  }
  .checkFallback() when (isunit(@baseOutputx,rem)) and not (isunit(@baseOutputy,rem)) {
      background-position: @baseOutputx*10px @baseOutputy;
  }
  .checkFallback() when not (isunit(@baseOutputx,rem)) and (isunit(@baseOutputy,rem)) {
      background-position: @baseOutputx @baseOutputy*10px;
  }
  .checkFallback() when not (isunit(@baseOutputx,rem)) and not (isunit(@baseOutputy,rem)) { }

  .checkFallback();

  background-position: @baseOutputx @baseOutputy;
}