SASS Mixin 重写 &(符号)
SASS Mixin Rewrite & (ampersand)
我正在尝试编写一个 mixin 来修改输出的父选择器。这个想法是,在调用 mixin 的情况下,父选择器将需要对其进行字符串替换。我已经完成了大部分工作,但我不知道如何吞下 &
.
.test {
@include alt_parent() {
content: 'test';
}
}
mixin 是这样的:
@mixin alt_parent() {
#{str-replace(unquote("#{selector_append(&)}"), "s", "x")} {
@content;
}
}
我的字符串替换工作正常,所以这不是问题所在。我得到的是这个(我明白为什么):
.test .text {
content: 'test';
}
我要的是这个:
.text {
content: 'test';
}
您必须使用 @at-root
指令来阻止自动包含由 &
表示的选择器。
http://alwaystwisted.com/articles/2014-03-08-using-sass-33s-at-root-for-piece-of-mind
@mixin alt_parent($parent) {
@at-root {
#{str-replace(unquote("#{selector_append(&)}"), "s", "x")} {
@content;
}
}
}
我正在尝试编写一个 mixin 来修改输出的父选择器。这个想法是,在调用 mixin 的情况下,父选择器将需要对其进行字符串替换。我已经完成了大部分工作,但我不知道如何吞下 &
.
.test {
@include alt_parent() {
content: 'test';
}
}
mixin 是这样的:
@mixin alt_parent() {
#{str-replace(unquote("#{selector_append(&)}"), "s", "x")} {
@content;
}
}
我的字符串替换工作正常,所以这不是问题所在。我得到的是这个(我明白为什么):
.test .text {
content: 'test';
}
我要的是这个:
.text {
content: 'test';
}
您必须使用 @at-root
指令来阻止自动包含由 &
表示的选择器。
http://alwaystwisted.com/articles/2014-03-08-using-sass-33s-at-root-for-piece-of-mind
@mixin alt_parent($parent) {
@at-root {
#{str-replace(unquote("#{selector_append(&)}"), "s", "x")} {
@content;
}
}
}