亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

Bulma Steps 在點擊提交按鈕后沒有進入下一步

Bulma Steps 在點擊提交按鈕后沒有進入下一步

茅侃侃 2022-12-09 13:59:25
我正在嘗試在 Vue 中創建一個 Buefy Steps。Buefy 步驟已經開始工作,但Submit按鈕不會前進到下一步(例如,從“帳戶”到“配置文件”)。應用程序視圖:<template>  <div id="app">    <section>      <div class="block">        <b-field v-if="hasNavigation" grouped group-multiline>          <b-field label="Prev icon">            <b-select v-model="prevIcon">              <option value="chevron-left">Chevron</option>              <option value="arrow-left">Arrow</option>            </b-select>          </b-field>          <b-field label="Next icon">            <b-select v-model="nextIcon">              <option value="chevron-right">Chevron</option>              <option value="arrow-right">Arrow</option>            </b-select>          </b-field>          <b-field label="Label position">            <b-select v-model="labelPosition">              <option value="bottom">Bottom</option>              <option value="right">Right</option>              <option value="left">Left</option>            </b-select>          </b-field>          <b-field label="Mobile mode">            <b-select v-model="mobileMode">              <option :value="null">-</option>              <option value="minimalist">Minimalist</option>              <option value="compact">Compact</option>            </b-select>          </b-field>        </b-field>      </div>      <b-steps        v-model="activeStep"        :animated="isAnimated"        :rounded="isRounded"        :has-navigation="hasNavigation"        :icon-prev="prevIcon"        :icon-next="nextIcon"        :label-position="labelPosition"        :mobile-mode="mobileMode"      >        <b-step-item step="1" label="Account" :clickable="isStepsClickable">          <h1 class="title has-text-centered">Account</h1>          <form ref="loginForm" class="form-horizontal form-material" @submit.stop.prevent>            <input type="hidden" name="customfield" class="form-control" :value="this.id">
查看完整描述

1 回答

?
慕容708150

TA貢獻1831條經驗 獲得超4個贊

看起來您將b-step的navigation插槽的內容移入b-step-item并忘記包含定義按鈕操作所需的template的插槽范圍的父項。即使使用,那也行不通,因為沒有插槽。nextSubmittemplateb-step-itemnavigation


解決方案是將這些按鈕放在 的b-step插槽中navigation:


<b-step>

  <b-step-item>...</b-step-item>

  <b-step-item>...</b-step-item>

  <b-step-item>...</b-step-item>


  <template slot="navigation" slot-scope="{previous, next}">

    <div class="field is-grouped is-grouped-centered">

      <p class="control">

        <a class="button is-primary" @click.prevent="next.action">Submit</a>

      </p>

      <p class="control">

        <a class="button is-light">Cancel</a>

      </p>

    </div>

  </template>

</b-step>


查看完整回答
反對 回復 2022-12-09
  • 1 回答
  • 0 關注
  • 110 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號