<template>
<div>
<!-- tabcontainer -->
<mt-tab-container class="page-tabbar-container" v-model="selected">
<mt-tab-container-item id="tab1">
tab1
</mt-tab-container-item>
<mt-tab-container-item id="tab2">
tab2
</mt-tab-container-item>
<mt-tab-container-item id="tab3">
tab3
</mt-tab-container-item>
<mt-tab-container-item id="tab4">
tab4
</mt-tab-container-item>
</mt-tab-container> <mt-tabbar v-model="selected" fixed>
<mt-tab-item id="tab1">
<img slot="icon" src="../assets/logo.png"> 外卖
</mt-tab-item>
<mt-tab-item id="tab2">
<img slot="icon" src="../assets/logo.png"> 订单
</mt-tab-item>
<mt-tab-item id="tab3">
<img slot="icon" src="../assets/logo.png"> 发现
</mt-tab-item>
<mt-tab-item id="tab4">
<img slot="icon" src="../assets/logo.png"> 我的
</mt-tab-item>
</mt-tabbar>
</div>
</template> <script>
export default {
data() {
return {
selected: 'tab1'
};
}
};
</script>

mint-ui之tabbar使用的更多相关文章

  1. mint ui的tabBar监听路由变化实现tabBar切换

    说明 最近学习vue,使用了mint ui的tabBar,感觉好难受,结合 tab-container使用更难受,因为它不是根据路由来切换页面的.mui与它基本相反,因此它能根据搜索栏的路由变化,相应 ...

  2. vue mint ui 手册文档对于墙的恐惧

    http://www.cnblogs.com/smallteeth/p/6901610.html npm 安装 推荐使用 npm 的方式安装,它能更好地和 webpack 打包工具配合使用. npm ...

  3. vue mint ui 手册文档

    npm 安装 推荐使用 npm 的方式安装,它能更好地和 webpack 打包工具配合使用. npm i mint-ui -S CDN 目前可以通过 unpkg.com/mint-ui 获取到最新版本 ...

  4. vue mint UI

    vue 与mint  UI 结合开发手机app  html5页面 api  文档   http://mint-ui.github.io/#!/zh-cn

  5. 基于VUE.JS的移动端框架Mint UI

    Mint UI GitHub:github.com/ElemeFE/mint 项目主页:mint-ui.github.io/# Demo:elemefe.github.io/mint- 文档:mint ...

  6. Mint UI文档

    Mint UI文档:http://elemefe.github.io/mint-ui/#/ 一.Mint UI的安装和基本用法. 1.NPM :npm i mint-ui -S 建议使用npm进行安装 ...

  7. 新建一个基于vue.js+Mint UI的项目

    上篇文章里面讲到如何新建一个基于vue,js的项目(详细文章请戳用Vue创建一个新的项目). 该项目如果需要组件等都需要自己去写,今天就学习一下如何新建一个基于vue.js+Mint UI的项目,直接 ...

  8. iView webapp / Mint UI / MUI [前端UI]

    前端UI iView webapp一套高质量的 微信小程序 UI 组件库 https://weapp.iviewui.com/?from=iview Mint UI 基于 Vue.js 的移动端组件库 ...

  9. Mint UI 使用指南

    上来直接在webpack里将Mint UI引入项目,发现各种问题.饿了么组件库文档太坑了,好多地方写错,有些该说明的地方没说,比如例子里单文件.vue组件里用的类post-css处理器,我一直使用SA ...

  10. Mint UI Example的运行

    Mint -UI是新推出的移动端UI框架 官网 不过官网上的文档例子不是很全面. 建议下载他们提供的example来学习. 1.examplle源码下载地址 2.打开项目,我这里使用webstorm, ...

随机推荐

  1. java框架常见的面试题

    1.谈谈你对MVC的理解 MVC是Model—View—Controler的简称.即模型—视图—控制器.MVC是一种设计模式,它强制性的把应用程序的输入.处理和输出分开. MVC中的模型.视图.控制器 ...

  2. html网页什么样的字体最好看,css设置各种中文字体样式代码

    css代码如下:{ font-family:"Microsoft YaHei",微软雅黑,"MicrosoftJhengHei",华文细黑,STHeiti,Mi ...

  3. react native 中使用react-native-vector-icons

    1.引入依赖 cnpm install react-native-vector-icons --save 2.LINK原生 react-native link react-native-vector- ...

  4. caffe的运行create_data.sh前对VOC2007图片格式的更改

    运用caffe进行深度学习之前需要对图片进行预处理,将图片的大小,格式等进行修改 将300*300的图片改为256*256格式 则将以下参数改为: min_dim=256 max_dim=256 wi ...

  5. [转]sql server 常用脚本(日常查询所需)

    1:查看sql server代理中作业的运行状况的脚本 -- descr : a simple sql script to view sql server jobs run status -- las ...

  6. uva 1322 Minimizing Maximizer

    题意: 有n个数,m个排序器,每个排序器可以把区间ai到bi的数从小到大排序.这m个排序器的输出就是m个排序之后的第n个数. 现在发现有些排序器是多余的.问至少需要多少个排序器可以使得输出不变.排序器 ...

  7. 第三方包源码maven 下载

    1,maven导包时候自动下载源码 在eclipse或者Myeclipse中 => window ==> preference ==> Maven ==> 勾选Download ...

  8. 以太坊客户端Ethereum Wallet与Geth区别简介

    以太坊客户端Ethereum Wallet与Geth区别简介 最近有不少朋友在搭建交易平台,在咨询和技术交流的过程中发现很多朋友不太清楚Ethereum Wallet和Geth区别.甚至有朋友使用Ge ...

  9. Redhat 简单本地yum 配置

    Redhat 简单本地yum 配置 一.将redhat 系统的镜像挂载到系统上 Vmware Workstion 环境下: [虚拟机设置]--[硬件]--[CD/DVD]--[使用ISO映像文件]-- ...

  10. oracle数据库基础功能

    一.oracle基本常用的数据类型 varchar(长度) 字符串char(长度) 字符number(x,y) x表示总位数 y表示保留小数点后几位数 eg面试题:number(5,3)最大的数是99 ...