1. 下载

npm i mint-ui -S

2. 引入

import MintUI from 'mint-ui'

import 'mint-ui/lib/style.css'

Vue.use(MintUI)

3. mt-header的编写

注意：从官网直接复制的代码存在一个bug  ，头部的左右两侧存在间隙

为解决这个问题 ，我们使用
fixed 就好了



4.使用轮播图的时候，注意将<!DOCTYPE html> 去掉
5.在使用轮播图后 我们可以将  fixed  去掉了  



6.   axios  的使用




Vue.prototype.$axios = Axios;

Axios.defaults.baseURL = 'https://www.sinya.online/api/';





　　请求数据：




created() {

    this.$axios.get('getlunbo')

      .then(res=>{

        console.log(res);

        this.imgs=res.data.message;

      })

      .catch(err=>console.log(err));

  }





　　用  v-for 循环将图呈现出来




y<mt-swipe :auto="4000">

        <mt-swipe-item v-for="(item,index)  in imgs"  :key="index">

                 <img  :src="item.img" >

        </mt-swipe-item>

   </mt-swipe>





　　





												


											
vue  App项目  首页的更多相关文章
	

    
								
  1. vue app项目 第一天  基本架构和路由配置
		
    一.前言 今天开始打算花6天时间 完成一个基于vue的买菜app 在这里记录一下项目的流程和第一次做这个项目遇到的坑 以及解决的办法 二.第一步 脚手架的安装 使用npm 安装好脚手架  安装脚手架教 ...
    
		
    2. 
						
  2. 关于个人开源项目(vue app)的一些总结
		
    关于个人开源项目(vue app)的一些总结 项目地址 https://github.com/BYChoo/record 项目简介 此项目名叫:Record.是以Vue全家桶(vue,vue-rout ...
    
		
    3. 
						
  3. 「Vue」vue cli3项目打包为APP方法及坑点
		
    1.执行npm run build之后生成dist文件夹 2.打开HBuilderX新建一个APP项目 3.把dist文件夹里的所有文件拷贝替换到APP文件夹下 4.打开manifest.json文件 ...
    
		
    4. 
						
  4. vue.js项目安装
		
    Vue.js 安装 NPM 方法安装vue.js项目 npm 版本需要大于 3.0,如果低于此版本需要升级它: # 查看版本 $ npm -v 2.3.0 #升级 npm npm install np ...
    
		
    5. 
						
  5. Vue开源项目汇总(史上最全)(转)
		
    目录 UI组件 开发框架 实用库 服务端 辅助工具 应用实例 Demo示例 UI组件 element ★13489 - 饿了么出品的Vue2的web UI工具套件 Vux ★8133 - 基于Vue和 ...
    
		
    6. 
						
  6. day 82 Vue学习二之vue结合项目简单使用、this指向问题
		
    Vue学习二之vue结合项目简单使用.this指向问题   本节目录 一 阶段性项目流程梳理 二 vue切换图片 三 vue中使用ajax 四 vue实现音乐播放器 五 vue的计算属性和监听器 六  ...
    
		
    7. 
						
  7. vue ssr 项目改造经历
		
    vue ssr 项目改造经历 由于工作项目需求,需要将原有的项目改造,vue ssr 没有用到nuxt,因为vue ssr更利于seo,没办法,一个小白的改造经历, 首先说明一下,小白可以借鉴,高手也 ...
    
		
    8. 
						
  8. 从无到有构建vue实战项目（二）
		
    二.vue项目的初步搭建 该项目我采用了当下最流行的vue ui框架---element-ui,首先用vue-cli构建一个vue项目: vue create education 然后会出现一系列配置 ...
    
		
    9. 
						
  9. 新书上线：《Spring Boot+Spring Cloud+Vue+Element项目实战：手把手教你开发权限管理系统》，欢迎大家买回去垫椅子垫桌脚
		
    新书上线 大家好,笔者的新书<Spring Boot+Spring Cloud+Vue+Element项目实战:手把手教你开发权限管理系统>已上线,此书内容充实.材质优良,乃家中必备垫桌脚 ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. 《代码大全2》读书笔记 week 7
			
    博主终于继续更<代码大全2>了 (*´・ω・`)⊃,课上老师一再强调读书笔记要写出自己的心得不能简单摘抄,所以我现在基本上只会写一下自己在阅读过程中印象深刻或者有发散思考的地方,字数可能 ...
    
			
    2. 
						
  2. Linux运行jar包
			
    要运行java的项目需要先将项目打包成war包或者jar包,打包成war包需要将war包部署到tomcat服务器上才能运行.而打包成jar包可以直接使用java命令执行. 在linux系统中运行jar ...
    
			
    3. 
						
  3. mysql导入.csv文件出错
			
    1.报错信息 ERROR 1290 (HY000): The MySQL server is running with the --secure-file-priv option so it cann ...
    
			
    4. 
						
  4. Linux上的VirtualBox如何使用USB
			
    问题: VirtualBox设置中已经启用了"USB2.0(EHCI)控制器"选项,但是虚拟机中始终没有USB设备,右下角的状态也显示没有连接任何USB设备,看起来像是Virtua ...
    
			
    5. 
						
  5. DBCP重连的问题及解决办法（转）
			
    本文转载:http://lc87624.iteye.com/blog/1734089,欢迎大家阅读原文. 使用数据库连接池时,免不了会遇到断网.数据库挂掉等异常状况,当网络或数据库恢复时,若无法恢复连 ...
    
			
    6. 
						
  6. The 'with' and 'as' Keywords
			
    Programming is all about getting the computer to do the work. Is there a way to get Python to automa ...
    
			
    7. 
						
  7. spring启动异步线程
			
    大纲: spring启动异步线程 spring配置线程池 一.spring启动异步线程 spring启动异步线程方法就是在方法上加上注解@Async,然后启动类或配置类上加上注解@EnableAsyn ...
    
			
    8. 
						
  8. IntelliJ IDEA下载地址
			
    http://www.jetbrains.org/display/IJOS/Download
    
			
    9. 
						
  9. v-model  双向数据绑定以及修饰符
			
    <!--v-model 实现双向数据绑定 其中一个值发生改变,另一个值也将实时发生改变--> <div id="app09"> <h1>{{ m ...
    
			
    10. 
						
  10. Robot Framework：Excel操作
			
    robot framework 操作Excel需要安装库 ExcelLibrary pip install robotframework-ExcelLibrary 将ExcelLibrary 导入到r ...
    
			
    11.