APP端解决click的点击延时300ms
方案一:使用attachstart替换click
方案二:使用第三方插件也即fastClick
1、 npm install fastclick --save // 在终端界面安装fastclick@1.0.6
2、 导入至main.js文件
import Vue from 'vue'
import App from './App'
Vue.config.productionTip = false
App.mpType = 'app'
// 引入全局uView
import uView from 'uview-ui'
Vue.use(uView);
// 引入混入
let vuexStore = require('@/store/$u.mixin.js');
Vue.mixin(vuexStore)
// 引入fastclick
import FastClick from 'fastclick'
//解决移动端300ms延时
FastClick.attach(document.body)
// 引入vuex
import store from '@/store';
const app = new Vue({
store,
...App
})
import utils from '@/common/utils.js'
// http拦截器,此为需要加入的内容,如果不是写在common目录,请自行修改引入路径
import httpInterceptor from '@/common/http.interceptor.js'
// http接口API集中管理引入部分
import httpApi from '@/common/http.api.js'
// 这里需要写在最后,是为了等Vue创建对象完成,引入"app"对象(也即页面的"this"实例)
Vue.use(httpApi, app)
Vue.use(httpInterceptor, app)
Vue.use(utils,app)
app.$mount()
图片懒加载的使用
1、使用npm install vue-lazyload --save 打开终端安装 vue-lazyload
2、导入至main.js文件 // main.js
import VueLazyLoad from 'vue-lazyload'
//使用懒加载插件
Vue.use(VueLazyLoad)
3、在使用的地方修改指令
//图片所在组件
//商品组件
<template>
<img :src="showImage alt="" @load="imgLoad"> //原
<img v-lazy="showImage" alt="" @load="imgLoad"> //修改后
</template>
<script></script>
<style lang="less" scoped>
.goods-item{
width:200px;
hieght:100vh;
}
</style>