钢材信息小程序开发总结(二) ---uniapp

整体项目一期代码
使用uniapp原因, 是因为工作中接触过, 所以就直接上手, 整体开发还是很顺畅, 少量bug.
具体开发还是以文档过几遍为主

问题一: 按钮加上border-radius会发现外层有个长方形线

解答:应该是他内部样式问题, 还是直接用view造一个方便

问题二: 如何文章页和文章详情页传值

解答:

  • 方法一, 可以直接带id, 然后请求
  • 方法二, 在列表页请求内容, 然后点击查看的时候把对应内容放入localStorage里, 到详情页再读取出来

问题三: 引入echarts

解答:

  • 小程序, 需要引入echarts和mpvue-echarts



  • h5, 只需引入echarts

参考资料:

  • echarts包下载地址: https://echarts.baidu.com/download.html
  • mpvue-echarts地址: https://github.com/F-loat/mpvue-echarts#readme
  • 使用方法: https://github.com/klren0312/ironInfoWeapp/blob/wechat/pages/details/details.vue

问题四: 解析markdown

解答:

  • 小程序, 需要引入mpvue-wxparse, marked
  • h5, 只需marked

marked将markdown转为html
mpvue-wxparse将html转为wxml

参考资料:

  • marked: https://github.com/markedjs/marked
  • mpvue-parse: https://github.com/F-loat/mpvue-wxParse#readme
  • 使用方法: https://github.com/klren0312/ironInfoWeapp/blob/wechat/pages/article/article.vue

问题五: 条件编译

解答:
https://uniapp.dcloud.io/platform
对于不同平台使用不同的代码

现在小程序开源了
https://github.com/klren0312/ironInfoWeapp
扫码体验?

钢材信息小程序开发总结(二) ---uniapp_第1张图片

或者访问网页版?
https://tlgc.zzes1314.cn

你可能感兴趣的:(钢材信息小程序开发总结(二) ---uniapp)