如何重新使用一个混合使用串联，形成有选择(How to re-use a mixin whose s

在少了，我可以这样写：

.outer {  
    .inner {  
        color: red;  
    }  
}

.test {  
    .outer .inner;
}

但是，当我写：

.outer {  
    &-inner {  
        color: red;  
    }  
}

.test {  
    .outer-inner;
}

当我删除了.test中， .outer-inner输出正常，但是当我将其重新添加， 编译器说：

.outer-内是不确定的。

反正有重新使用的样式的.outer-inner ？

调用混入，其选择是通过串联形成的，目前无法用量少。然而同样可能的是使用内插在编译时形成选择器（也被称为动态形成选择器）。

下面（内插/动态形成的选择器）将很好地工作。

@selector: .box;
@{selector}{
    color: red;
    .child{
        color:blue;
    }
}
.demo{
    .box; /* will create both parent & child */
}
.container{
    &.box{
        background: black;
    }
}
.demo2{
    .container.box;
}

然而，下面的例子将无法正常工作。

.container{
    &-box{
        color: blue;
    }
}
.demo2{
    .container-box; /* this will not work */
}

目前，一个工作周围有问题的方案是创建两个单独的减档 。

在第一个文件（test.less）添加下面的代码，并将其编译成一个CSS文件。

.outer {  
    &-inner {  
        color: red;  
    }  
}

在第二个文件，从导入的第一个文件与创建的CSS (less)的指令，然后调用/再利用的混入。

@import (less) "test.css";
.test {  
    .outer-inner;
}

注：由于七阶段-Max在评论中提到，这个问题类似于此项目。但是这两个问题都是不一样的 extend不会与这两个插选择器（动态形成）和级联选择工作。

选项2：另一种选择是写一个假混入或具有共同属性的一个单独的分离规则集 ，并利用它像下面。

@dummy: {color: red}; // detached ruleset

.outer{
    &-inner{
        @dummy();
    }
}

.test{
    @dummy();
}

要么

.dummy() {color: blue}; // dummy mixin and would produce no extra selector in output as it has parentheses.

.outer{
    &-inner{
        .dummy;
    }
}

.test{
    .dummy;
}