<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. sublime使用经验汇总

    1. source insight 会对某个修改频繁的文件做多次备份.我们用sublime进行多个文件搜索时,需要把备份的文件排除在外. e:\work\code\sourcev, *.h, *.cp ...

  2. vue中实现浏览器的复制功能

    点击复制,就可以实现copy <p class="inline-block"> <span >{{fenxiao.appSecret}}</span& ...

  3. .NET 黑魔法 - asp.net core 日志系统

    asp.net core 里如何记录日志呢? 这要从asp.net core的依赖注入说起,在asp.net core里的依赖注入真是无所不在,各种面向切面的接口与事件. 好吧,来点干货. 首先,我们 ...

  4. Unity shader学习之轮廓效果

    将物体描一层边可以使游戏看起来具有卡通风格,一种简单的实现方法如下: 将物体渲染2次,即使用2个通道. 第一个通道将顶点沿法线(或中心点到顶点的方向)做一个偏移,即将模型扩大一点,并将颜色渲染成轮廓的 ...

  5. windows下golang环境搭建

    (1)golang安装配置. 下载地址:https://www.golangtc.com/download 解压后直接配置系统环境变量path,加上go.exe所在文件的路径即可. 配置系统环境变量G ...

  6. FSDB Dumper

    FSDB:Fast Signal Database 相比较于VCD文件,FSDB文件的大小比VCD波形小5-50倍. 各家的仿真器都支持在simulation的过程中,直接生成FSDB文件 将VCD文 ...

  7. IFrame session(转)

    问题场景: 在一个应用(集团门户)的某个page中, 通过IFrame的方式嵌入另一个应用(集团实时监管系统)的某个页面. 当两个应用的domain 不一样时, 在被嵌入的页面中Session失效.( ...

  8. Window对象属性

    2018-11-28 12:21:20

  9. Spark学习之路 (六)Spark Transformation和Action

    Transformation算子 基本的初始化 java static SparkConf conf = null; static JavaSparkContext sc = null; static ...

  10. 【Elasticsearch学习之三】Elasticsearch 搜索引擎案例

    环境 虚拟机:VMware 10 Linux版本:CentOS-6.5-x86_64 客户端:Xshell4 FTP:Xftp4 jdk8 elasticsearch-2.2.0 第一步:获取数据主流 ...