littleWhale

功能操作流程

  1. 从左侧拖入组件到中间容器内。左侧组件不变，只是clone节点到中间容器。
  2. 中间容器不可再拖入左侧。中间容器各个部件可以在容器内上下拖动进行排序。
  3. 支持同类型多组件。从左侧拖入相同组件的时候，会先从中间容器拷贝同类型的部件。重用样式。每个部件id值唯一。
  4. 中间容器 选中某个部件，在选中的部件右上角显示删除按钮。右边显示对应的部件属性。
  5. 修改右边对应的部件属性，中间容器对应的部件可实时显示效果。
  6. 右边部件的属性根据 每个部件的类型不同而决定。
  7. 中间容器下方底部可设置大容器的页面背景颜色。
  8. 最后提交保存全部部件的属性。这样就完成了一个页面模板。 下次页面模板编辑的时候，页面进入直接显示实时效果。
    图片
阅读全文

H5微信支付的优点就是快，应用App通过内置浏览器一个支付链接，唤起微信App进行支付再跳转回应用App。

微信H5支付后台配置

for example:
第一步添加支付支付域名gaoying.cn（顶级域名，非二级或三级域名），应用服务器向微信服务器拿到支付链接称m_weburl，给到App。

  1. 如果App是应用内开WebView打开m_weburl,则m_weburl不需要拼接redirect_url参数。
  2. 如果出现“商家参数格式有误，请联系商家解决”说明在请求m_weburl时referer为空导致的。则需要拼接referer参数qiu.gaoying.cn （顶级域名的多级子域名）。
    如果不是设置的第一步中配置的支付域名的子域名，设置其他的子域名，比如xxx.abc.cn 则会出现“商家存在未配置的参数，请联系商家解决”。则需要再添加abc.cn到支付域名中。
  3. 支付成功后如果没有跳转回到应用App. 则把referer的值配置成scheme形式如：qiu.gaoying.cn:// 并在App应用配置好scheme为qiu.gaoying.cn。

支付成功后并返回App. 到此，并完成了。

多个App H5微信支付：
当手机装有多个公司应用，H5 支付后如何正确跳转回到对应 app

Echart

数据看板首要问题，就是我们要解决数据分组的问题。你可以存储到浏览器的websql中通过sql语句groupBy来进行分组统计，或者你自己用js对数据进行分组。由于数据量有限，也就几百个吧，这里采取js方式对数据进行内存分组统计。

1
2
3
4
5
6
7
8
9
export const groupBy = (list, fn) => {
    const groups = {};
    list.forEach(function(o) {
        const group = JSON.stringify(fn(o));
        groups[group] = groups[group] || [];
        groups[group].push(o);
    });
    return groups;
}
阅读全文

上一篇文章快速搭建前端网络请求有跟大家介绍Vue快速搭建一个H5页面，以及怎样实现H5和Native原生事件交互。基于此基础，我们今天来用WeUI.js实现手机图片的上传。

Package.json配置

1
2
3
4
5
6
7
8
9
"dependencies": {
    "jquery": "^3.5.0",
    "moment": "^2.24.0",
    "vue-datetime": "^1.0.0-beta.11",
    "weui.js": "^1.2.1"
},
"devDependencies": {
    "weui": "^2.1.3"
}
阅读全文