search

glhd / alpine-wizard

Multi-step wizard helpers for Alpine.js
MIT License
148 stars 3 forks source link

x-if doesnt seem to work on the first element #3

Open xtfer opened 2 years ago

xtfer commented 2 years ago

The following should only show the third step, but always shows the first step. The second step is skipped.

        <div x-data="{ errors: true }">

            <div x-wizard:step x-wizard:if="errors == false">
                First
                <x-buttons.standard-a @click="$wizard.forward()"
                                      ::disabled="$wizard.cannotGoForward()"
                                      x-show="$wizard.isNotLast()">Confirm & continue...</x-buttons.standard-a>
            </div>

            <div x-wizard:step x-wizard:if="errors == false">
                Second
                <x-buttons.standard-a @click="$wizard.forward()"
                                      ::disabled="$wizard.cannotGoForward()"
                                      x-show="$wizard.isNotLast()">Confirm & continue...</x-buttons.standard-a>
            </div>

            <div x-wizard:step>
                Third
            </div>
        </div>