项目问题汇总(一)

250 阅读1分钟

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>