升级基础库到 3.0
文件更新：
- Layout/theme.html
- Layout/mobile.html
文件新增：
- Snippets/data.html
功能特点：
- 基于 Vue.js 生态重构网站基础业务；
- 响应式设计，适配不同端不同大小窗口；
- 易于迭代更新网站功能；
- 支持 SaaS 系统的新评价功能；
- 兼容原有的旧评价插件（此插件将不再开发迭代，请尽快迁到新评价功能）；
- 兼容后端渲染主题（Liquid），且核心业务代码能用于新型主题；
- 主题方向逐渐由后端渲染转到前端渲染，基于现有系统架构让网站前台更开放和灵活，同时也让前端开发效率更高。
相关说明：
- 修改位置可参考「藤煤竹」主题相关代码；
- 修改组件 DOM 结构：
- 请参考 Vue 生命周期相关资料；
- 可以通过
JSSDK.events.subscribe()去订阅事件（查看文档）； - 组件生命周期事件回调返回第一个参数（
vm）为相关组件 Vue 实例，vm.$el为组件 DOM 实例； - 暂时只开放部分组件部分 Vue 生命周期事件；
- 修改组件样式：
- 全局标准 CSS 变量和组件的全局 CSS 变量还在前期规划，暂时不公开；
- 建议前期直接新增自定义 CSS 样式去重置默认样式；
- 样式优先级问题：
- 可以在相关页面模板底部引入「内部样式表」（
<style>/* Style Code... */</style>）；
- 可以在相关页面模板底部引入「内部样式表」（
- 基础库到 3.0 的「功能插件」都基于 plugins.js：
- 业务代码基于旧有代码移植，后续会基于 Vue.js 生态重构并迁入 base.js；
- 功能插件有：
- SaaS 系统的新评价功能插件。
- 部分 JS 引入需设置
crossorigin和async属性； - UI 和视觉相关后续会优化，前期业务功能迭代优先；
新增 Snippets/data.html
内容如下：
<script>
window.$$shop = {{ shop | json }}
window.$$settings = {{ settings | json }}
</script>
修改 Layout/theme.html 和 Layout/mobile.html
添加 Resource Hints - preconnect
<!-- 一般放 <link rel="preconnect" href="//res.wx.qq.com"> 下面 -->
<link rel="preload" href="{{ '../theme/base/0.1.0/js/base.js' | global_asset_url }}" as="script" crossorigin>
添加 Snippets/data.html 引入
<!-- 一般放 {{ content_for_header }} 下面 -->
{% include 'data' %}
添加 base.js 和 plugins.js
<script src="{{ '../theme/base/0.1.0/js/base.js' | global_asset_url }}" crossorigin></script>
<!-- 一般放 youpage.min.js 上面 -->
<!-- 一般放 <body> 内的最下面 -->
<script src="{{ '../theme/base/0.1.0/js/plugins.js' | global_asset_url }}" async crossorigin></script>
简单测试用例
- 抽查页面，JS 代码运行不报错；
- 登录和注册流程正常；
- 免登陆购买流程正常；
- 无登录购买流程正常（添加购物车 > 提交购物车 > 跳转登录 > 登录后跳转提交订单页 > 提交订单成功 > 支付成功 > 订单详情页）。
以上内容仍未解决您的问题？
联系在线客服
