sass unicode字符编码问题

$icons: (
    "address-book" "\f2b9",
    "address-card" "\f2bb"
);
@function match($haystack,$needle){
  @each $item in $haystack{
    $index:index($item,$needle);
    @if $index{
      $return: if( $index == 1,2,$index);
      @return nth($item,$return);
    }
  }
  @return false;
}


@mixin icon($position:"before",$icon:false){
  &:#{$position}{
    content: match($icons,$icon);
  }
}
.#{$css-prefix}address-book{
  @include icon($position:"before",$icon:"address-book");
}
.#{$css-prefix}address-card{
  @include icon($position:"before",$icon:"address-card");
}

在$icons中的"f2b9"这种字符,在经过sass编译后就变成了实体的图标或者不可见的字符,如何解决这个问题,在github上我查询到这个解决方法

// @source - [@Stephn-R](https://github.com/sass/sass/issues/1395#issuecomment-57483844)
// @description converts 1 or more characters into a unicode 
// @markup {scss}
// unicode("e655"); // "\e655"
@function unicode($str){
 @return unquote("\"")+unquote(str-insert($str, "\\", 1))+unquote("\"")
}

我想问问还有其他能解决的办法么?

阅读 3.2k
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
宣传栏