web端项目中遇到的问题

iOS 滑动不流畅

ios 手机上下滑动页面会产生卡顿，手指离开页面，页面立即停止运动。整体表现就是滑动不流畅，没有滑动惯性。 iOS 5.0 以及之后的版本，滑动有定义有两个值 auto 和 touch，默认值为 auto。

• 解决方式 1.在滚动容器上增加滚动 touch 方法

.wrapper {
  -webkit-overflow-scrolling: touch;
}
复制代码

2.设置 overflow 设置外部 overflow 为 hidden,设置内容元素 overflow 为 auto。内部元素超出 body 即产生滚动，超出的部分 body 隐藏。

body {
  overflow-y: hidden;
}
.wrapper {
  overflow-y: auto;
}

ios 日期转换 NAN 的问题

将日期字符串的格式符号替换成'/'

'yyyy-MM-dd'.replace(/-/g, '/')

使用jsencrypt加密后，经get方式传递后解密为null

跳到外部链接时，需要将加密后的信息使用get方法的参数带到url上，然后那边接收到后解密， 问题：密文通过url传输后，密文丢失且错误，导致解密为null

加密：

import { setEncryt } from "@/utils/encrypt";

const url = `https://test.com/param=${setEncryt(text)}`
window.open(
    url,
    "_self"
);
      
解密：

import { decrypt } from "@/utils/encrypt";
// 获取url上的参数信息
let text = query.param;
console.log("解密后:", decrypt(text));

结果：

null
      

解决方案：

加密并编码：
const text= "13111111111"; // 要加密的信息
let encrytText = setEncryt(phone); // 进行加密
var res = encodeURI(encrytText); // 进行url编码
const url = `https://test.com/param=${setEncryt(res)}`
window.open(
    url,
    "_self"
);


解密并解码：
let text = query.param; // 接收到的url编码后的密文
const decodeUrl = decodeURI(text);  // 进行url解码
console.log("解码后的密文", decodeUrl);
const replaceText = decodeUrl.replace(/\s/g, "+"); // 将密文传递过程丢失的+号，替换回来

flex值代表的含义

• flex是flex-grow flex-shrink？|| flex-basis的简写，说明flex属性值可以是一个、两个、或者是三个，剩下的为默认值
• 默认值为flex： 0 1 auto（不放大但会缩小）

• none： 0 0 auto（既不放大也不缩小）
• auto：1 1 auto（放大且缩小）

• 如果flex是一个非负数n：则该数字代表的是flex-grow的值，剩下的两个都是默认值，即flex：n 1 0%；比如说：flex：1 --> flex：1 1 0%