我需要一種變通方法來將帶有破折號的Liquid變量分配給javascript變量名稱

Question

我的產品頁面上有一個簡短的表格，供客戶提交其電子郵件地址。 Javascript用於在我用來管理電子郵件訂閱的Klaviyo電子郵件系統中，在電子郵件地址旁邊分配自定義屬性。

我已經能夠使用Liquid輸出將一些Shopify產品信息（例如產品ID）作為這些自定義屬性之一發送。 但是，我想發送一個SKU，句柄或產品名稱，該名稱不起作用，因為此數據是使用破折號作為分隔符來存儲的。 這會導致Javascript解析器出現問題

<script type="text/javascript">
    KlaviyoSubscribe.attachToForms('#email_signup', {
        hide_form_on_success: true,
        custom_success_message: true,
        custom_error_message: true,
        extra_properties:{ //Fully customisable - call them what you want
            PROPERTY_{{ Shopify.Liquid.Variable }}:true
        }
    });
</script> 

在上面的示例中， PROPERTY_{{ product.id }}:true是可以的。 這將解析為類似於PROPERTY_123456789:true ，該內容將被正確解析並傳輸。

但是， PROPERTY_{{ product.handle }}:true會變成PROPERTY_product-handle-example:true

此處的破折號不在javascript中解析。 我一直在嘗試將Liquid變量放入JS字符串之類的東西，但沒有得到它。 我敢肯定這很簡單，但是我看不到這棵樹上的木頭。

Answer 1

您可以使用JSON過濾器：

{{ Shopify.Liquid.Variable | json }}

如此處所述： https : //help.shopify.com/en/themes/liquid/filters/additional-filters#json

HTH

Answer 2

我想您的解析器在將javascript發送到客戶端之前確實可以處理該頁面，但是我想從您的角度來看它是正確的，您可以使用['property'] 。

從准備者的角度來看應該沒問題

KlaviyoSubscribe.attachToForms('#email_signup', {
    hide_form_on_success: true,
    custom_success_message: true,
    custom_error_message: true,
    extra_properties:{ //Fully customisable - call them what you want
        ['PROPERTY_{{ Shopify.Liquid.Variable }}']:true
    }
});