工作中遇到的问题

1.安排任务之后,要先去了解整个功能是怎么样的 不要一步一步的去完成。

2.接口对了,但是数据不对   先看看是不是 VueResource中设置的地址  有没有设置成传你端口那个人的   

 

import Vue from 'vue'
import VueResource from 'vue-resource'
import Utils from '@/utils/utils'

Vue.use(VueResource);

// 测试 xxxxxxxxxxxx1
//      xxxxxxxxxxxx2
//      xxxxxxxxxxxx3
//      xxxxxxxxxxxx4
//      xxxxxxxxxxxx5
//正式  xxxxxxxxxxxx6

//测试环境
const localhost = 'xxxxxxxxxxxx1' 

//生产环境
// const localhost = 'xxxxxxxxxxxx' 


Vue.http.interceptors.push(function (request, next) {//拦截器  
  request.headers.set('Authorization', Utils.getCookie('token')); //setting request.headers 
  request.headers.set('Uid', Utils.getCookie('uid') ? Utils.getCookie('uid').toString() : undefined); //setting request.headers
  next()
})
const actions={
  /*
  
  * @method 发送请求方法
  * 必传
  * @params request_method:请求方式  API_url:API地址  query:请求参数
  
  */
  callingInterface({},{request_method,API_url,query,flag,callback}){
    //请求地址+API
    const url = localhost + API_url;
    //是否开启emulateJSON  
    const is_flag = flag!==undefined ? flag : false;
    //回调函数,处理提交mutaion修改state的操作
    const callMethod = callback!==undefined ? callback : (()=>{});
    console.log('请求传入参数query:', query)

    return new Promise((resolve, reject) => {
      Vue.http[request_method](url, query ,{
        emulateJSON: is_flag
      }).then(res => {
        resolve(res);
        callMethod(res);
        console.log('请求成功:', res);
      }, err => {
        console.log('请求失败:', err)
        reject(err.body)
      })
    })
  },
  //查询开票申请、提现申请、推广申请条数
  async applyNumAPI({dispatch,commit}){
    return await dispatch('callingInterface',{
      request_method:'get',
      API_url:'gpu_admin/finance/pending_num',
      callback:({body})=>{
        commit('setState',{
          name:'applyData',
          val:body
        });
      }
    });
  },
  //获取快捷方式列表接口
  async shortcutListAPI({dispatch,commit},query){
      return await dispatch('callingInterface',{
        request_method:'get',
        API_url:'gpu_admin/shortcut/list',
        query:{
          params:query
        },
        callback:({body})=>{
          commit('setState',{
            name:'urlList',
            val:body.data
          });
        }
      })
  },
  //修改快捷方式
  async updateShortcutAPI({dispatch},query){
    return await dispatch('callingInterface',{
      request_method:query.method,
      API_url:'gpu_admin/shortcut/list',
      query:query.data
    })
  }
}

export default {
  actions
}

 

3.获取不到数据/数据不对

是不是没有按照接口文档的参数来写 

  接口文档参数  keywords 

 

我自己写的

正确写法

 

 

文档参数传值 

 

 

4.事件穿透 https://www.cnblogs.com/zhaixr/p/8269204.html

5.样式线下正确 线上被覆盖  用多类选择器

6.设计师给的切图不好做样式(譬如说文字在背景图上面)

可以直接和UI设计师交流,要他改切图 方便你写样式。

7.样式在苹果端和Android设备/Google浏览器不一样, 使用line-height:35px!important大了权重依旧没用, 解决办法:

在Safari浏览器或Apple设备上打开网址 发现样式没有被修改 , 但是行内样式生效, 于是修改行内样式 问题解决!

8.同样的方法 ,第一种可以正常输出结果,但是第二种不可以, 可以看看是不是方法写错了 比如Array.from( ) 写成了 Array.form( )

9.发现页面有问题(不一定是CSS 可能是JS的原因),找错误  

 

 

点击后发现少了一行 , 找CSS样式没找到原因 ,后来查看 JS代码 发现

 

是JS代码的原因

 

10.遇到bug寻找问题思路 ?

  1. 能否复现? 
  2. 确认用户是否是用最新版本触发的 ,老版本确实会触发。
  3. 可能是软件缓存的问题

11.微信扫码打开的页面,没有右上角的跳转按钮?  那是因为你访问的地址没有域名

 

 

 

 

 

 

 直接访问有域名的地址 http://hncs.xc.gjhd.cn:8000/xcgjhd/download/app.html 

 12.  有可能node版本和 yarn add 时node环境不一样

 

 

 

 

自己坑自己系列

// document.querySelector('meta[name="viewport"]').setAttribute('content','initial-scale=' + 1 + ', maximum-scale=' + 1 + ', minimum-scale=' + 1 + ', user-scalable=no');

因为没有和ios全屏保持一致 导致
// ios全屏
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no, viewport-fit=cover"/>

 

 

状态栏出来了 

13.

https链接图片无法显示

<head>
  <meta name="referrer" content="no-referrer">
</head>

 

 

 

 

posted @ 2019-05-20 16:53  一路向北√  阅读(547)  评论(0编辑  收藏  举报

web应用开发&研究 -

业精于勤而荒于嬉。

工作,使我快乐。


Font Awesome | Respond.js | Bootstrap中文网