Commit a36ad92b authored by June_Q's avatar June_Q

docs:添加和更新docs

parent b55a7f89
#### 注意
+ 关于getStorage和setStorage
- 不要用封装的getStorage单独通过uni.setStorage设置的本地存储
```
// 封装的setStorage没有判断字符串,直接对字符串换为 JSON 字符串, getStorage拿出来的值是对应的基本数据类型(基本数据类型)
el:
const str1 = "1"
const num = 1
setStorage("str1", str1) ""1""
getStorage("str1") // "1"
setStorage(num) // "1"
getStorage("num") // 1
getStorage("str1") === getStorage("num") // false
error:
uni.setStorageSync("str2", str1) // "1"
getStorage("str1") === getStorage("str2") // true
```
+ 小程序和vue页面生命周期顺序
- created => onLoad => onShow => mounted => onReady => onUnload => destroyed
+ 关于zIndex层级<font color="red">为防止层级规范</font>
- 一般层级(普通层级,如展示一些普通信息) zIndex范围 1-98
- 当前页面最高层级,如遮罩 zIndex 99
- 仅次于小程序原生弹窗 zIndex 100
+ 小程序线上版本库2.16.0 (后端在授权开通服务的时候会设置)
+ APPID
- wx537e892e36fbf79d // 这个线上的 貌似是省冷的
- wxd170058f4ad8fecd // 开发用的
+ 接口的返回,所有的数据必须在data里面(pc端是随意的)
#### warning
+ 2021/6/29,本日起的代码可能会引起不适,but all can run(效率和质量不会成正比关系)
#### unFinish, but not important)
+ 详情有个深拷贝的问题。暂时通过JSON.stringify()处理
+ 所有的价格都是通过toFixed会可能出现精度问题。一般发现不了
## 格利专属小程序(第三方服务)
#### 注意
+ 关于getStorage和setStorage
- 不要用封装的getStorage单独通过uni.setStorage设置的本地存储
```javascript
// 封装的setStorage没有判断字符串,直接对字符串换为 JSON 字符串, getStorage拿出来的值是对应的基本数据类型(基本数据类型)
el:
const str1 = "1"
const num = 1
setStorage("str1", str1) ""1""
getStorage("str1") // "1"
setStorage(num) // "1"
getStorage("num") // 1
getStorage("str1") === getStorage("num") // false
error:
uni.setStorageSync("str2", str1) // "1"
getStorage("str1") === getStorage("str2") // true
```
+ 小程序和vue页面生命周期顺序
- created => onLoad => onShow => mounted => onReady => onUnload => destroyed
+ 关于zIndex层级<font color="red">为防止层级规范</font>
- 一般层级(普通层级,如展示一些普通信息) zIndex范围 1-98
- 当前页面最高层级,如遮罩 zIndex 99
- 仅次于小程序原生弹窗 zIndex 100
+ 小程序线上版本库2.16.0 (后端在授权开通服务的时候会设置)
+ APPID
- wx537e892e36fbf79d // 这个线上的 貌似是省冷的
- wxd170058f4ad8fecd // 开发用的
+ 接口的返回,所有的数据必须在data里面(pc端是随意的)
#### warning
+ 2021/6/29,本日起的代码可能会引起不适,but all can run(效率和质量不会成正比关系)
#### unFinish, but not important
+ 详情有个深拷贝的问题。暂时通过JSON.stringify()处理
+ 所有的价格都是通过toFixed会可能出现精度问题。一般发现不了
+ 确认订单页面要跳到地址列表页面选择
\ No newline at end of file
## 格利pc交接文档
#### 关于更新注意事件
+ 由于缓存问题,每次更新手动需要更新 js 文件的版本号
- static/js/uitil.js
```javascript
// 第一行 这里的版本号用用于后面动态加载js用的
var appVersion = "2.5.4";
```
- /theme/mall/default/public
```javascript
// header2.html
<link rel="stylesheet" href="/themes/mall/default/css/min/${app}.css?v=2.5.4">
// update.html
<script src="/static/js/util.js?v=2.5.4"></script>
<script src="/themes/mall/default/js/min/${app}.js?v=2.5.4"></script>
```
+ 更改vue压缩包(这里更新时不改压缩包影响也不是很大,但是建议改了)
> /public/update.html
```javascript
<script src="/static/js/vue/dist/vue.js"></script>
// 修改为
<script src="/static/js/vue/dist/vue.min.js"></script>
```
+ 动态加载 js 和 css
> 动态插入 script 做加载
```javascript
// wargin 这里必须依赖util.js 因此你必须引用footer2.html或者update.html,再或者你可以手动单独用script标签引用util.js
// loadCssLink是没有回调函数的
// loadJs可以传入回调函数,在动态插入js脚本后执行
<script>
loadCssLink('/themes/mall/default/css/min/xy_detail.css')
loadJs('/themes/mall/default/js/min/localfood/xy_detail.js')
</script>
```
#### 关于设置 Vue 的 prototype
> 如果你想和 vuecli 构建单页面一样使用 prototype, 这里你可以在 public/update.html 里面,在<script src="/themes/mall/default/js/min/${app}.js?v=2.5.4"></script>这个标签前面添加 script,如下
```javascript
// ...
<script src="/${app}/jslang.jl"></script>
<script>Vue.prototype.$t = () => console.log(111)</script>
<script src="/themes/mall/default/js/min/${app}.js?v=2.5.4"></script>
```
#### bug
## 关于 jquery.lazyload 和 vue 渲染的问题
> 产生问题的原因:图片加载失败和 lazyload 都会重新设置 img 的 src,导致 vue 绑定的值失效。
> 解决办法:
- 1.如果是单图,那就直接用 jq 或者 vue 在获取数据后直接修改 dom 的 src 值
- 2.如果是列表就不能用上面的方法,当然,用也是可以的,遍历修改。目前我的解决办法是在 static/util.js 的 lazyload 函数直接让某个用 vue 的页面不用懒加载
- 最好的做法(前面两种只是将错就错的做法)
```javascript
// 将下面函数替换static/util.js 的 lazyload 函数, 然后搜索全局data-original, 将所有的img 添加类名lazyload,改动涉及太多(45个文件119处修改)
// 然后后面所有需要懒加载的手动加类名lazyload,vue直接用src="i.img || loading.png"(也可以写在util里面,因为util在vue之后)
function lazyload() {
$("img").error(function () {
//当图片加载失败时的操作
$(this).attr("src", "/themes/mall/default/images/loading.png");
});
document.addEventListener(
"error",
function (event) {
var ev = event ? event || window.event : "";
var elem = ev.target;
if (elem.tagName.toLowerCase() == "img") {
// 图片加载失败 --替换为默认
elem.src = "/themes/mall/default/images/loading.png";
}
},
true
);
$("img.lazyload").lazyload({
placeholder: "",
effect: "fadeIn",
event: "scroll",
threshold: 300,
skip_invisible: false,
});
}
```
#### 新开页面使用模板
```javascript
<% include("../public/header2.html"){} %> // 这个会引用了很多公用的css和一个jq
<!-- 顶部导航条 -->
<% include("../public/shortcut_1.html"){} %>
<!-- 公共头 -->
<!-- <% include("../public/header_3.html"){} %> -->
<div>内容</div>
<!-- 公共页脚 -->
// footer2.html和update.html二选一(不用两个都引用)
// footer2.html插入了update.html
// 使用关键看你需不需要footer,如果不需要直接用update
<% include("../public/update.html"){} %>
<% include("../public/footer2.html"){} %>
// 动态插入js css必须在update.html或者footer2.html之后,引用需要util.js, 如下
<script>
loadCssLink('/themes/mall/default/css/min/xy_detail.css')
loadJs('/themes/mall/default/js/min/localfood/xy_detail.js')
</script>
</body>
</html>
```
#### 注意
+ 不要使用第三方cdn(你不能保证别人的cdn会不会挂)
+ 尽量少用es6+的新语法,比如async。 因为没经过babel转换,不同浏览器会有兼容问题
+ 不要用axios了(用了也解决不了这座祖传代码), 直接用util下的__ajax
+ 编译和压缩,引用全部用对应目录下的min/
- 压缩js js/js下的文件全部压缩到js/min下面
- 压缩css css/less下的文件全部压缩到css/min下面
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment