签到

05月05日
尚未签到

共有回帖数 0

    李小主任

    等级:
    【编者按】从内测到开启公测,微信小程序已然成为了 IT 领域最为火热的话题,除却不同类型应用的可能性探索之外,对于开发团队而言,最多的当属踩过的那些坑。近一段时间,CSDN 也在为知识库项目进行小程序开发的初步尝试,对此,CSDN 高级研发工程师尚琳凯在一次线下活动中分享了知识库小程序开发的一些经验,本文为扼要总结。微信小程序的世界还都充满着未知数,欢迎邮件mobile@csdn.net交流分享。小程序为开发者提供了什么什么是小程序小程序是微信推出的一种新的公众号的形态,不需要下载安装,即可在微信中使用的应用。同时,需要注意的是,小程序、订阅号、服务号、企业号是并行的体系。









    知识库小程序开发知识库小程序开发的初步尝试关注重点是 JS 文件和 WXML 文件。
    由于知识库把开发领域细分成某个领域,例如技术语言、运维系统、行业应用等方面,对每个技术和知识点都设计一个网状图谱,来总结技术某一方面涉及到的知识,同时为知识结构准备一些精品的内容,方便大家更系统的学习知识。所以在知识库这个产品上,需要实现内容推荐、个人中心以及搜索。用户侧和内容推荐都包括四层:库-》知识结构-》内容列表-》内容详情页。搜索功能可以根据搜索的关键词查找到用户侧或推荐知识库的相关内容,方便大家阅读或收藏。
    知识库页面设计小程序组件满足了所有的显示功能和结构(列表、窗口、按钮、事件等),API 齐全,便于逻辑开发。不同的功能模块放在不同的页面里,具体表现为:
    视图层: Tab 栏,列表页,知识结构页,内容详情页,搜索页逻辑层: Tab 栏-通过绑定数据index选择一级页面;列表页-通过改变绑定数据contentlist数组,控制列表显示和动态加载;搜索页-通过绑定数据searchValue,通过事件及时获取用户输入。小程序开发路上踩过的坑1. 打开页面数量限制(redirectTo还是navigateTo)
    微信提供 Tab 栏的设置,可以在app.json中配置,在 App 里配置的 Tab 栏将出现在所有的一级页面。但是它有一个问题就是第一次点击 Tab 将会打开一个新的页面,微信对打开页面的数量限制是五个。




    每一个库都有一个树状的知识结构,大家请看这个例子。每个层级展示的方式是一样的,所以正常情况下,我们都会选用递归的方式来使展示。比如在这张图里,当我们判断这个节点拥有子节点,就想再次调用同样方法显示。但是很遗憾,小程序里,不论是使用模板,还是使用include的方式引用文件,都没有办法做到自己调自己。
    幸运的是我们知道层级最深有多少,这样就可以写几个同样的文件和模板,加上不同的命名来调用。如果是未知层级的树状结构,就会非常难以处理。在这里可以建议大家将树状结构变成数组的形式,加上层级标识,在 WXML 文件中可以使用循环的方式来处理层级的显示。
    3. HTML 页面在微信小程序中展示
    这是一个非常难处理的问题,微信不支持 HTML 页面的展示,所以需要把所有 HTML 的标签转化成小程序内允许的标签。我们使用了一个名叫wxParse的应用,它的功能就是通过正则表达式将 HTML 页面转化成 JSON 形式,再用模板的方式展现出来。在这里面规定了各个标签的样式(WXSS)。遗憾的是它也有层级方面的问题,同样是重复写了很多完全一样的模板。


    顺序调用如果 HTML 的标签层级结构超出了模板个数,那么超出部分将无法显示出来。这个应用是在微信中运行的,建议大家把数据转化放在服务器端来进行,将转换后的数据发给小程序。另外小程序setData()一次不能超过1024K,如果你的 JSON 格式数据超过这个限制,就会很难再拼接。
    4. 冒泡事件
    一个组件上的事件被触发后,该事件会向父节点传递,由此引起不必要的逻辑处理,对此,使用费冒泡事件处理。
    5. 网络请求接口wx.request()没有携带 Cookies
    如果服务器端有通过获取 Cookies 处理的逻辑没办法和小程序结合,只能为小程序单独开发新的接口。


    总结小程序在运营上的优势在于微信用户量大,适合推广,某些功能单一的 App 可以在小程序中实现,不用再下载 App。开发者不用考虑平台,开发成本低。但同时不适合开发逻辑复杂界面丰富的程序,受到框架限制,随意性小,无法满足所有功能。

    楼主 2016-12-01 09:23 回复

共有回帖数 0
  • 回 帖
  • 表情 图片 视频
  • 发表

登录直线网账号

Copyright © 2010~2015 直线网 版权所有,All Rights Reserved.沪ICP备10039589号 意见反馈 | 关于直线 | 版权声明 | 会员须知