【问题标题】:Using asset_url within a .js.liquid file在 .js.liquid 文件中使用asset_url
【发布时间】:2013-06-23 06:43:48
【问题描述】:

我正在编写一个 Shopify 主题,我需要在我的一个模板中使用带有自定义指针的 Google 地图。

我在使用 Javascript 文件中的 asset_url 时遇到问题,因此我可以正确链接到我的新指针/标记图形。关于我做错了什么的任何指示?

我尝试了以下两种方法,但都没有成功:

var image = {
  url: "url({{ 'gr_gm-pointer.png' | asset_url }})"
  ...etc
};

var image = {
  url: url({{ 'gr_gm-pointer.png' | asset_url }})
  ...etc
};

我是 javascript 和 Liquid 方面的新手,因此我们将不胜感激。提前感谢您的帮助。

【问题讨论】:

  • Liquid 解析完成后你检查 JS 文件了吗?添加正在呈现的代码可能包括找到解决方案的关键。

标签: javascript google-maps shopify liquid


【解决方案1】:

您确定您的主题中存在该资产吗?当引用这样的资产时,我所有使用 js.liquid 文件的测试都可以正常工作。

【讨论】:

  • 100% 确定它在我的资产文件夹中。哪种方式适合你?
  • 两种方式都适合我。我猜你没有正确引用你的 js.liquid 文件,所以液体没有被渲染。检查一下。
【解决方案2】:

仅当您在 .liquid 文件中编写脚本时它才起作用;

<script>
....
....append('<img src=\"{{ 'ajax-loader.gif' | asset_url }}" />');
....
</script>

或者这里有其他解决方案;

https://ecommerce.shopify.com/c/ecommerce-design/t/hardcoding-asset-url-s-is-it-safe-31768

【讨论】:

    【解决方案3】:

    这是旧的,但我一直在努力解决这个问题并找到了解决方案,所以我想我会发布一个答案。谷歌地图标记对象有一个图标属性,你可以像这样在液体中调用它:

    var marker = new google.maps.Marker({
          position: latLng,
          map: map,
          icon: '{{ 'your-icon.png' | asset_img_url: '60x' }}'
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2014-08-19
      • 2011-12-12
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多