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

下面我就為大家分享一篇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中文網其他相關文章！