vue v-nav指令属性列表
v-nav指令属性列表
| 属性名 | 属性描述 | 类型 | 必选 | 默认 |
|---|---|---|---|---|
| title | 导航栏标题 | String | No | 空字符串 |
| showBackButton | 是否显示(左边的)返回按钮 | Boolean | No | false |
| onBackButtonClick | 返回按钮点击回调函数 默认调用history.go(-1) | Function | No | undefind |
| showMenuButton | 是否显示(右边的)菜单按钮 | Boolean | No | false |
| onMenuButtonClick | 菜单按钮点击回调函数 | Function | No | undefind |
| backButtonText | 返回按钮文字(图标) | String | No | 见备注 |
| menuButtonText | 菜单按钮文字(图标) | String | No | 见备注 |
html页面
<div class="page has-navbar" v-nav="{title: '标题',showBackButton:true,onBackButtonClick,showMenuButton:true,onMenuButtonClick,menuButtonText:'+'}"></div>
js中需要写两个方法: onBackButtonClick 和 onMenuButtonClick , 分别对应返回按钮和菜单按钮两个事件,这里我用的是vue框架
var model={
template: '#tem',
data: function(){
return data;
},
methods: {
onMenuButtonClick:function(){
},
onBackButtonClick:function(){
}
}
}
效果: 返回键和菜单键都是可以点的

vue v-nav指令属性列表的更多相关文章
- 前端(二十一)—— vue指令:文本类指令、避免页面闪烁、v-bind指令、v-on指令、v-model指令、条件渲染指令、列表渲染指令
文本类指令.v-bind指令.v-on指令.v-model指令.条件渲染指令.列表渲染指令 一.文本操作 v-text:文本变量 <p v-text='msg'></p> &l ...
- 02: vue.js常用指令
目录:Vue其他篇 01: vue.js安装 02: vue.js常用指令 目录: 1.1 vuejs简介 1.2 选择器:根据id.class等查找 1.3 静态绑定数据 data 1.4 插值 { ...
- (day65、66)Vue基础、指令、实例成员、JS函数this补充、冒泡排序
目录 一.Vue基础 (一)什么是Vue (二)为什么学习Vue (三)如何使用Vue 二.Vue指令 (一)文本指令 (二)事件指令v-on (三)属性指令v-bind (四)表单指令v-model ...
- Vue成员与指令介绍
一.Vue介绍 1.什么是vue 通过对框架的了解与运用程度,来决定其在整个项目中的应用范围, 可以独立完成前后端分离式web项目的渐进式JavaScript框架 2.为什么要学vue 三大主流框架之 ...
- vue.js自定义指令入门
Vue.js 允许你注册自定义指令,实质上是让你教 Vue 一些新技巧:怎样将数据的变化映射到 DOM 的行为.你可以使用Vue.directive(id, definition)的方法传入指令id和 ...
- vue 对象提供的属性功能、通过axio请求数据(2)
1 Vue对象提供的属性功能 1.1 过滤器 过滤器,就是vue允许开发者自定义的文本格式化函数,可以使用在两个地方:输出内容和操作数据中. 1.1.1 使用Vue.filter()进行全局定义(全局 ...
- 2.0 vue内置指令与自定义指令
1.1 常用内置指令 1) v:text : 更新元素的 textContent 2) v-html : 更新元素的 innerHTML 3) v-if : 如果为 true, 当前标签才会输出到页 ...
- Vue基础以及指令
Vue 基础篇一 一.Vue框架介绍 之前大家学过HTML,CSS,JS,JQuery,Bootstrap,现在我们要学一个新的框架Vue~ Vue是一个构建数据驱动的web界面的渐进式框架. 目 ...
- vue.js循环for(列表渲染)详解
vue.js循环for(列表渲染)详解 一.总结 一句话总结: v-for <ul id="example-1"> <li v-for="item in ...
随机推荐
- Spring Cloud Config采用Git存储时两种常用的配置策略
由于Spring Cloud Config默认采用了Git存储,相信很多团队在使用Spring Cloud的配置中心时也会采用这样的策略.即便大家都使用了Git存储,可能还有各种不同的配置方式,本文就 ...
- NLP入门(三)词形还原(Lemmatization)
词形还原(Lemmatization)是文本预处理中的重要部分,与词干提取(stemming)很相似. 简单说来,词形还原就是去掉单词的词缀,提取单词的主干部分,通常提取后的单词会是字典中的单 ...
- Python之使用Pandas库实现MySQL数据库的读写
本次分享将介绍如何在Python中使用Pandas库实现MySQL数据库的读写.首先我们需要了解点ORM方面的知识. ORM技术 对象关系映射技术,即ORM(Object-Relational ...
- Opencv-python画图基础知识
相关函数介绍 1. Point 该数据结构表示了由其图像坐标 和 指定的2D点.可定义为: Point pt; pt.x = 10; pt.y = 8; 或者 Point pt = Point(10, ...
- 《Redis开发与运维》读书笔记
一.初始Redis 1.Redis特性与优点 速度快.redis所有数据都存放于内存:是用C语言实现,更加贴近硬件:使用了单线程架构,避免了多线程竞争问题 基于键值对的数据结构,支持的数据结构丰富.它 ...
- C#设计模式之十四命令模式(Command Pattern)【行为型】
一.引言 今天我们开始讲“行为型”设计模式的第二个模式,该模式是[命令模式],又称为行动(Action)模式或交易(Transaction)模式,英文名称是:Command Pattern.还是老套路 ...
- Laravel5.5 数据库迁移:创建表与修改表
数据库迁移是数据库的版本管理,要使用数据库迁移,需要在.env文件中连接好数据库(不多说).laravel本身已经存在user表和password_resets表的迁移了,因此,执行 php arti ...
- Android为TV端助力 最简单的自定义圆点view
首先创建一个选择器,用来判断圆点状态,可以根本自己的需求改 <selector xmlns:android="http://schemas.android.com/apk/res/an ...
- Retrieve OpenGL Context from Qt 5.5 on OSX
In the latest Qt 5.5, the QOpenGLWidget is much better and has less bugs than the QGLWidget, but it ...
- Quill Editor使用公式
const katex = require('katex'); const win: any = window; win.katex = katex; 首先,引入katex @import '~kat ...