首頁 > web前端 > js教程 > vue2.0 實作頁面導覽提示引導的方法

vue2.0 實作頁面導覽提示引導的方法

亚连
發布: 2018-05-30 15:31:44
原創
2709 人瀏覽過

下面我就為大家分享一篇vue2.0 實現頁面導航提示引導的方法,具有很好的參考價值,希望對大家有所幫助。

使用者在進行一些新的操作流程時,提供一些導航流程也是必要的。專案中採用的是iview 的對話框進行實現的。

demo:

#
  <Modal v-if="modalOFF === 1">
  <p>这里是对话框一</p>
  <button @click="modalOFF = 2"></button>
  </Modal>
  <Modal v-if="modalOFF === 2">
  <p>这里是对话框二</p>
  <button @click="modalOFF = 3"></button>
  </Modal>
  <Modal v-if="modalOFF === 3">
  <p>这里是对话框二</p>
  <button @click="modalOFF = null"></button>
  </Modal>
登入後複製

##js程式碼:

让谁先显示,就在data中定义modalOFF的属性值。默认是
 modalOFF: 1,
登入後複製

當modalOFF為null的時候,對話方塊也就消失了。

上面是我整理給大家的,希望今後對大家有幫助。

相關文章:

JS實作將連結產生二維碼並轉為圖片的方法

Vue實作動態建立和刪除資料的方法

基於vue2.0動態元件及render詳解

##

以上是vue2.0 實作頁面導覽提示引導的方法的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板