首页 > 解决方案 > Snipcart:关闭地址字段中的自动完成功能

问题描述

是否可以关闭地址字段中的自动完成功能?我可以看到有

<template v-if="useAutocomplete">

在模板中。但是我在哪里可以将它设置为“假”?

标签: snipcart

解决方案


我也对这个感兴趣。我确定其目的是允许开发人员关闭自动完成功能,但我无法让它工作。作为一种解决方法,您可以通过覆盖地址字段组件来覆盖模板:

    <div hidden id="snipcart" data-api-key="API_KEY">
        <address-fields>
            <div class="root">
                <div class="snipcart-form__row">
                    <div class="snipcart-form__field snipcart-form__cell--large">
                        <snipcart-label class="snipcart__font--tiny" for="address1">
                            {{ $localize('address_form.address1') }}
                        </snipcart-label>
                        <snipcart-input name="address1"></snipcart-input>
                        <snipcart-error-message name="address1"></snipcart-error-message>
                    </div>

                    <div class="snipcart-form__field snipcart-form__cell--tidy">
                        <snipcart-label class="snipcart__font--tiny" for="address2">
                            {{ $localize('address_form.address2') }}
                        </snipcart-label>
                        <snipcart-input name="address2"></snipcart-input>
                        <snipcart-error-message name="address2"></snipcart-error-message>
                    </div>
                </div>

                <div class="snipcart-form__field">
                    <snipcart-label class="snipcart__font--tiny" for="city">{{ $localize('address_form.city') }}
                    </snipcart-label>
                    <snipcart-input name="city"></snipcart-input>
                    <snipcart-error-message name="city"></snipcart-error-message>
                </div>

                <div class="snipcart-form__field">
                    <snipcart-label class="snipcart__font--tiny" for="country">{{ $localize('address_form.country') }}
                    </snipcart-label>
                    <snipcart-typeahead type="dropdown" name="country" autocomplete="country"></snipcart-typeahead>
                </div>

                <div class="snipcart-form__row">
                    <div class="snipcart-form__field snipcart-form__cell--large">
                        <snipcart-label class="snipcart__font--tiny" for="province">
                            {{ $localize('address_form.province') }}
                        </snipcart-label>
                        <snipcart-typeahead type="dropdown" name="province" autocomplete="province state">
                        </snipcart-typeahead>
                    </div>

                    <div class="snipcart-form__field snipcart-form__cell--tidy">
                        <snipcart-label class="snipcart__font--tiny" for="postalCode">
                            {{ $localize('address_form.postalCode') }}
                        </snipcart-label>
                        <snipcart-input name="postalCode"></snipcart-input>
                        <snipcart-error-message name="postalCode"></snipcart-error-message>
                    </div>
                </div>
            </div>
        </address-fields>
    </div>

请参阅:https ://docs.snipcart.com/v3/setup/customization

我希望有人能提供更好的答案。


推荐阅读