Shopifyの液体テーマでベースアセットのURLを取得するには？

Question

は、Shopify液体のテーマで基本アセットのURLを取得する方法はありますか？

私はページをShopifyに翻訳しています。このページには、そのように結合Vuejsデータを使用しています。

<img src="/path/to/assets/folder/{{ color }}1.jpg"> 

それをエンコードURLますので、私はフィルタに中括弧を渡すことはできません。アセットURLにアクセスできれば簡単です。

アイデア？

Answer 1

あなたはescape liquid templatesできるので、あなたは私に言わせれば、この

<img src="/path/to/assets/folder/{{ "{{ color " }}}}1.jpg"> 

ない素敵なようなあなたのタグは次のようになります。しかし、別のオプションがあります。文字補間の代わりにvueバインドを使用します。v-bindディレクティブを使用するときに中括弧はなく、そのディレクティブの純粋なjavascriptを記述して、src属性を引用するか、変数に追加しますあなたのコンポーネントの。テキスト変数

<!-- template --> 
<img :src="img_path"> 

// js, data or props attribute 
img_path: '/path/to/assets/folder/' + color + '1.jpg' 

ノートをusign

<img :src=" '/path/to/assets/folder/' + color + '1.jpg' "> 

をusign

：私はv-bind:src => :src