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 相关文章推荐
jQuery Tools tooltip使用说明
Jul 14 Javascript
如何使用PHP+jQuery+MySQL实现异步加载ECharts地图数据(附源码下载)
Feb 23 Javascript
基于jQuery插件实现点击小图显示大图效果
May 11 Javascript
jQuery+Ajax实现限制查询间隔的方法
Jun 07 Javascript
Js 获取当前函数参数对象的实现代码
Jun 20 Javascript
详解AngularJS controller调用factory
May 19 Javascript
vue解决一个方法同时发送多个请求的问题
Sep 25 Javascript
vue的.vue文件是怎么run起来的(vue-loader)
Dec 10 Javascript
js实现数字滚动特效
Dec 16 Javascript
js实现select下拉框选择
Jan 11 Javascript
Vue 自适应高度表格的实现方法
May 13 Javascript
vue中如何添加百度统计代码
Dec 19 Vue.js
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
Zend 输出产生XML解析错误
2009/03/03 PHP
PHP下对数组进行排序的函数
2010/08/08 PHP
解析php利用正则表达式解决采集内容排版的问题
2013/06/20 PHP
PHP 转义使用详解
2013/07/15 PHP
使用php验证复选框有效性的示例
2013/11/13 PHP
利用phpExcel实现Excel数据的导入导出(全步骤详细解析)
2013/11/26 PHP
php中substr()函数参数说明及用法实例
2014/11/15 PHP
PHP中addslashes与mysql_escape_string的区别分析
2016/04/25 PHP
CI框架表单验证实例详解
2016/11/21 PHP
ThinkPHP框架中使用Memcached缓存数据的方法
2018/03/31 PHP
2007/12/23更新创意无限,简单实用(javascript log)
2007/12/24 Javascript
基于JQuery 的消息提示框效果代码
2011/07/31 Javascript
JQuery中extend使用介绍
2014/03/13 Javascript
jquery text()方法取标签中的文本
2014/07/25 Javascript
jquery延迟对象解析
2016/10/26 Javascript
bootstrap栅格系统示例代码分享
2017/05/22 Javascript
微信小程序页面缩放式侧滑效果的实现代码
2018/11/15 Javascript
微信小程序封装自定义弹窗的实现代码
2019/05/08 Javascript
零基础写python爬虫之爬虫的定义及URL构成
2014/11/04 Python
Python学习小技巧之列表项的排序
2017/05/20 Python
Python编程之string相关操作实例详解
2017/07/22 Python
Python装饰器语法糖
2019/01/02 Python
24式加速你的Python(小结)
2019/06/13 Python
使用Python计算玩彩票赢钱概率
2019/06/26 Python
基于python分析你的上网行为 看看你平时上网都在干嘛
2019/08/13 Python
Python 实现一个计时器
2020/07/28 Python
html5 css3网站菜单实现代码
2013/12/23 HTML / CSS
英国音乐设备和乐器商店:Gear4music
2017/10/16 全球购物
Ego Shoes官网:英国时髦鞋类品牌
2020/10/19 全球购物
.NET初级开发工程师面试题
2014/04/18 面试题
C#笔试题和英文面试题
2013/02/07 面试题
提高EJB性能都有哪些技巧
2012/03/25 面试题
求职推荐信范文
2013/12/01 职场文书
学生喝酒检讨书
2014/02/06 职场文书
中秋节慰问信
2015/02/15 职场文书
会计做账心得体会
2016/01/22 职场文书