登录
注册
模板
购买
商业授权
主机域名
专业授权
易优代理
易优AI版
易优+
应用
源码
插件
问答
帮助
视频教程
易优技巧
常见问题
易优手册
标签工具
更多
小程序
组件库
案例库
小程序模板网
首页
小程序模板网
开发文档
小程序开发教程
正文
H5与小程序如何共用的一套代码? ——小程序混合开发
发布时间:2018-06-04 12:16
所属栏目:
小程序开发教程
目标
很多时候,大家是不是有这种想法,开发的小程序,H5与小程序能否共用的一套代码,带后端并且可以提交给微信审核?
告诉你,可以!
如何做呢?看下边
准备工作
平台:
进入www.bmob.cn
找到Bmob最新推出的混合平台 JSSDK库,它支持 Node.js 、微信小程序 、Weex 、React Native 、Quick App 和浏览器等,写一份js可以以上任意平台。
混合数据SDK
文档地址: http://doc.bmob.cn/data/wechat_app_new/index.html
后端直接使用Bmob后端云,如果使用自己的服务器,请求网络这块可以用Fly,同样是跨平台,具体可以上github查看。
框架的选择:
由于mpvue官方有跨平台前端示例,这里为了少踩点坑,选择mpvue
实战
1:分析页面请求
需要实现的页面如下:
从上图,我们可以看到这个页面,有2个数据来自后端,分表是广告图与列表数据。
2.建立数据表
2.1广告图
数据结构如下
```
[
{
"title": "1299元起,诺基亚X6正式发布",
"image": "http://img.ithome.com/newsuploadfiles/focus/f3583ca6-9a52-461b-b2b2-0f649fab0516.jpg",
"link": "/pages/news/detail?id=360077&title=1299元起,诺基亚X6正式发布"
}
]
```
在后台建个表slides,导入数据/src/db/slides.json
列表数据
我在后台建个表newslist,导入数据/src/db/newslist.json,跟上一步一样的操作
详细数据
建立新闻内容表newscontent,导入数据/src/db/newscontent.json
3.修改请求代码到数据库
列表修改请求代码:
```
//api.js,getNewsList改为
getNewsList: (r) => {
//返回一个异步对象
return new Promise((resolve, reject) => {
//查询`newslist` 数据
const query = Bmob.Query('newslist')
query.find().then(res => {
//返回一个json数据
resolve({'newslist': res})
}).catch(err => {
reject(err)
})
})
},
```
数据已经从Bmob数据库调用出来了。广告图操作一样,具体代码看github(https://github.com/bmob/ithome-lite)
这样就实现了,首页的广告、数据列表、内容展示功能,如果您的小程序只是一个展示功能,可以使用此代码进行修改。
易优小程序(企业版)+灵活api+前后代码开源
码云仓库:
本文地址:https://www.eyoucms.com/wxmini/doc/course/24498.html
复制链接
如需定制请联系易优客服咨询:800182392
点击咨询
热门问题
最新问题
1
微信小程序自定义组件 - 表格组件来啦
2
微信小程序自定义navigationBar顶部导航栏,兼容适配所有机型(附完整案例)
3
手机界面设计尺寸规范
4
小程序-记牌器
5
微信小程序app.json文件常用配置说明
6
微信小程序获得session_key和openId(加解密、签名系列)
7
微信小程序|实现界面滑动切换
8
小程序登录的最优流程
9
微信小程序尺寸单位rpx和样式使用详解
10
微信小程序-scroll-view滚动到指定位置(类似锚点)
1
微信小程序app.json文件常用配置说明
2
微信小程序文字控制单行超过显示省略号
3
微信小程序参数传递的几种方法
4
微信小程序使用button按钮分享
5
微信小程序的setData
6
小程序分享,获取openid
7
微信小程序-实现tab
8
微信开发者工具新建和导入小程序
9
微信小程序实现点击拍照长按录像功能
10
微信小程序必知知识
产品
商业授权
开通会员
易优代理
推荐主机
服务
更新日志
用户案例
加入Q群
增值服务
帮助
易优问答
标签手册
易优技巧
功能字典
关于
关于易优
知识产权
版权声明
隐私协议
工作日 8:30-12:00 14:30-18:00
周六及部分节假日提供值班服务
联系我们
QQ在线咨询
业务客服
付费修改
加入Q群
微信客服
工作日 8:30-12:00 14:30-18:30
AI智能客服
×