如何改变动态变量值

时间:2013-06-24 13:41:09

标签: dotless

如何使用动态无点变量。我的意思是如何在无点文件中动态分配值。有什么办法吗?

style.less文件包含

@url_image: 

#head{ background: url(@url_image) no-repeat left top white;}

如何在运行时分配值?

3 个答案:

答案 0 :(得分:1)

有很多方法可以做到这一点。在我的例子中,较少的内容和动态参数都存储在DB中。如果要更改十六进制代码颜色,可以执行以下操作:

var parser = new dotless.Core.Parser.Parser();
var env = new dotless.Core.Parser.Infrastructure.Env { Compress = true, Debug = true, KeepFirstSpecialComment = false, DisableVariableRedefines = false };
var tree = parser.Parse(css.Detail.Text, null);

foreach (var key in layout.LessDetails.CurrentValues.Keys)
{
   var rule = tree.Variable("@" + key, tree);

   if (rule != null)
   {
      string value = layout.LessDetails.CurrentValues[key];

      if (value != null && value.StartsWith("#"))
      {
         rule.Value = new dotless.Core.Parser.Tree.Color(value.TrimStart('#'));
      }
   }
}

css.Detail.GeneratedText = tree.ToCSS(env);

这不是一个完整的解决方案,因为还有许多其他类型的参数,但它应该引导您朝着正确的方向前进。查看dotless.Core.Parser.Functions以获取有关各种选项的有用信息。

或者,还有另一个简单的选择。使用上面的代码,您只需将更改的变量附加到css.Detail.Text字符串的末尾即可。这实际上是modifyVars方法在less.js文件中的工作方式。通过在结尾处再次添加参数,它将覆盖先前的设置值。

答案 1 :(得分:0)

当你说在.less文件中动态更改时,我不确定你为什么要在更少的文件中更改它。如果您只是在.less文件中更改它,则必须编译该文件,以便将更改导航到style.min.css和style.css文件,这些文件无法以编程方式执行。

这是你可以做的:

 $('#head').css('background-image', "url("new-source");

所以jquery / javascript是你最好的选择

答案 2 :(得分:0)

如果您手动解析并输出无点文件,则可以执行此操作。

var config = DotlessConfiguration.GetDefaultWeb();
config.DisableVariableRedefines = true;

string less = File.ReadAllText(fileName);
StringBuilder sb = new StringBuilder(less);
sb.AppendLine(string.Format("{0}: {1};", "@url_image", "image.jpg"));

return LessWeb.Parse(sb.ToString(), config);