less函数传参和字符串拼接

在vue项目中，组件中使用的是less语法，当写成这种样式是，图片在network中可以正常获取到，但是无法显示在页面上

.bg-image(@imageName){
    background-image: url("./@{imageName}.png");
}

> .icon{
    display: inline-block;
    width: 25px;
    height: 24px;
    background-size: cover;
    &.icon0{
        .bg-image('glod')
    }
    &.icon1{
        .bg-image('silver')
    }
    &.icon2{
        .bg-image('copper')
    }
}

将上面的样式改成如下，成功显示图片：

  .bg-image(@imageName){
    background-image: ~"url(./@{imageName}.png)";
  }

注意：less中参数需使用@，使用时需使用   @{变量名}使用