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. KiCAD原理图导出PDF方法
			
    KiCAD原理图导出为PDF 1.文件->绘制 2.按照下图选择保存目录和输出格式后,选择绘制当前页或者所有页
    
			
    2. 
						
  2. printf 格式化打印   awk 数据处理工具
			
    printf解析 这个玩意说白了,就是格式化打印输出. awk awk与sed都是处理数据的工具.sed是处理整行的数据,awk则比较倾向于一行当中分成数个[字段]来处理. 具体操作: 注意的几个点  ...
    
			
    3. 
						
  3. 论文学习——《Learning to Compose with Professional Photographs on the Web》 (ACM MM 2017)
			
    总结 1.这篇论文的思路基于一个简单的假设:专业摄影师拍出来的图片一般具备比较好的构图,而如果从他们的图片中随机抠出一块,那抠出的图片大概率就毁了.也就是说,原图在构图方面的分数应该高于抠出来的图片. ...
    
			
    4. 
						
  4. 安装docker-ce与卸载(centos 7)
			
    1.安装依赖 docker依赖于系统的一些必要的工具,可以提前安装. 1 yum install -y yum-utils device-mapper-persistent-data lvm2 2.添 ...
    
			
    5. 
						
  5. Spring Boot 2.0 常见问题总结(二)
			
    使用 IDEA 生成 POJO 实体类 a. 使用 idea 连接上需要操作的数据库. b. 选中要生成实体类的数据库表:右键 ---> Scripted Extensions --->  ...
    
			
    6. 
						
  6. NLP(一) Python常用开发工具
			
    一.Numpy NumPy系统是Python的一种开源的数值计算包. 包括: 1.一个强大的N维数组对象Array: 2.比较成熟的(广播)函数 库: 3.用于整合C/C++和Fortran代码的工具 ...
    
			
    7. 
						
  7. javascript的简洁的写法
			
    每种语言都有它特别的地方,对于JavaScript来说,使用var就可以声明任意类型的变量,这门脚本语言看起来很简单,然而想要写出优雅的代码却是需要不断积累经验的.本文利列举了JavaScript初学 ...
    
			
    8. 
						
  8. Http头域字段详解
			
    HTTP(HyperTextTransferProtocol) 是超文本传输协议的缩写,它用于传送WWW方式的数据,关于HTTP协议的详细内容请参考RFC2616.HTTP协议采用了请求/响应模型.客 ...
    
			
    9. 
						
  9. Machine Learning 之一，什么是机器学习。
			
    Machine Learning 机器学习,什么是机器学习.我觉得尚学堂的培训老师讲的很不错,就是两个字来介绍.------拟人. 就是模拟人类的思维方式. 老师举的例子: 和女朋友约会,第一次约会, ...
    
			
    10. 
						
  10. wampServer2.2        You don't have permission to access /phpmyadmin/ on this server.
			
    You don't have permission to access /phpmyadmin/ on this server. 打开 然后
    
			
    11.