vue2.0 实现页面导航提示引导的方法


Posted in Javascript onMarch 13, 2018

用户在进行一些新的操作流程时,提供一些导航流程也是必要的。项目中采用的是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的时候,对话框也就消失了。

以上这篇vue2.0 实现页面导航提示引导的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript中的document.open()方法使用介绍
Oct 09 Javascript
使用jQuery判断IE浏览器版本的代码
Jun 14 Javascript
js 数组去重的四种实用方法
Sep 09 Javascript
浅谈javascript属性onresize
Apr 20 Javascript
表单验证正则表达式实例代码详解
Nov 09 Javascript
JS 通过系统时间限定动态添加 select option的实例代码
Jun 09 Javascript
jQuery+Pdo编写login登陆界面
Aug 01 Javascript
详解如何在Angular中快速定位DOM元素
May 17 Javascript
Javascript 一些需要注意的细节(必看篇)
Jul 08 Javascript
Javascript中parseInt的正确使用方式
Oct 17 Javascript
微信小程序实现页面分享onShareAppMessage
Aug 12 Javascript
js实现限定范围拖拽的示例
Oct 26 Javascript
vue2.0 根据状态值进行样式的改变展示方法
Mar 13 #Javascript
使用Vuex实现一个笔记应用的方法
Mar 13 #Javascript
基于Axios 常用的请求方法别名(详解)
Mar 13 #Javascript
Bootstrap 中data-[*] 属性的整理
Mar 13 #Javascript
JS实现的集合去重,交集,并集,差集功能示例
Mar 13 #Javascript
setTimeout时间设置为0详细解析
Mar 13 #Javascript
vue-cli脚手架config目录下index.js配置文件的方法
Mar 13 #Javascript
You might like
PHP 变量类型的强制转换
2009/10/23 PHP
Laravel使用Caching缓存数据减轻数据库查询压力的方法
2016/03/15 PHP
php处理json格式数据经典案例总结
2016/05/19 PHP
php7安装yar扩展的方法详解
2017/08/03 PHP
Laravel5.1 框架Request请求操作常见用法实例分析
2020/01/04 PHP
PHP单元测试配置与使用方法详解
2019/12/27 PHP
PHP实现随机发扑克牌
2020/04/22 PHP
js截取字符串的两种方法及区别详解
2013/11/05 Javascript
浅析js预加载/延迟加载
2014/09/25 Javascript
JavaScript实现添加、查找、删除元素
2015/07/02 Javascript
jQuery实现模拟marquee标签效果
2015/07/14 Javascript
JS获取时间的相关函数及时间戳与时间日期之间的转换
2016/02/04 Javascript
Uploadify上传文件方法
2016/03/16 Javascript
jquery实现ajax提交表单信息的简单方法(推荐)
2016/08/24 Javascript
jQuery事件与动画基础详解
2017/02/23 Javascript
jQuery正则验证注册页面经典实例
2017/06/10 jQuery
NodeJS链接MySql数据库的操作方法
2017/06/27 NodeJs
详解 vue.js用法和特性
2017/10/15 Javascript
微信小程序使用slider设置数据值及switch开关组件功能【附源码下载】
2017/12/09 Javascript
JS数组求和的常用方法实例小结
2019/01/07 Javascript
vue项目中运用webpack动态配置打包多种环境域名的方法
2019/06/24 Javascript
JavaScript自定义超时API代码实例
2020/04/30 Javascript
vue+koa2搭建mock数据环境的详细教程
2020/05/18 Javascript
vue实现一个6个输入框的验证码输入组件功能的实例代码
2020/06/29 Javascript
手机浏览器唤起微信分享(JS)
2020/10/11 Javascript
Python实现文件复制删除
2016/04/19 Python
Python中functools模块函数解析
2017/03/12 Python
CSS3 滤镜 webkit-filter详细介绍及使用方法
2012/12/27 HTML / CSS
纯css3显示隐藏一个div特效的具体实现
2014/02/10 HTML / CSS
畜牧兽医本科生的自我评价
2014/03/03 职场文书
人力资源管理专业自荐书
2014/07/07 职场文书
2014年设计师工作总结
2014/11/25 职场文书
南京南京观后感
2015/06/02 职场文书
AJAX实现省市县三级联动效果
2021/10/16 Javascript
Vue OpenLayer 为地图绘制风场效果
2022/04/24 Vue.js
box-shadow单边阴影的实现
2023/05/21 HTML / CSS