ding-open-org-try-entry v1.0.0

ding-open-org-try-entry

为了避免多个isv商家重复开发开通组织的入口，并且可以维持UI的一致性，这里提供的一个开通组织的插件。

安装

浏览器

<script src="ding-open-org-try-entry.umd.js"></script>

npm

npm i ding-open-org-try-entry --save

参数

• skuQuery 跳转sku商品规格页参数，默认会取 location.search 的参数。 articleCode 商品code是毕传参数。
• openWrapStyle 开通组织试用的容器样式。
• openTextStyle 开通组织试用的提示文案样式。
• openButtonStyle 开通组织试用的按钮样式。
• insertElement 开通组织试用的容器挂载的节点。默认为 body 节点。
• openTipText 开通组织试用的提示文案。
• openButtonText 开通组织试用的按钮文案。

示例

直接调用

import dingOpenOrgTryEntry from 'ding-open-org-try-entry';

dingOpenOrgTryEntry.init();

自定义参数

import dingOpenOrgTryEntry from 'ding-open-org-try-entry';

dingOpenOrgTryEntry.config({
    insertElement: document.querySelector('#customizeElement'),
}).init();

浏览器引入

if (window.__DingOpenOrgTryEntry) {
    window.__DingOpenOrgTryEntry.init();
}

注意事项

1. 开通组织试用的容器，样式使用了固定定位、默认高度为 64px。为了避免视图内容展示，请预留好足够的空间。也可以通过自定义 openWrapStyle 覆盖默认样式。

2. 开通组织试用的容器高度为固定值64px，如果在css中预留空间时被转换为了rem或vw等。请配置相应的转化工具的class白名单。例如 postcss-px-to-viewport。

module.exports = {
    plugins: {
        'postcss-px-to-viewport': {
            selectorBlackList: ['.ding-open-reserved-space'],
        }
    }
}

.ding-open-reserved-space {
    margin-top: 64px;
}