在线时间:8:00-16:00
迪恩网络APP
随时随地掌握行业动态
扫描二维码
关注迪恩网络微信公众号
ssm服务端开发如下: ssm服务端使用了maven+springMVC+mybatis,对于业务处理,数据库查询存储这些就不用说了。因为这些挺简单的。我们这里重点说的是服务端怎么返回json数据给微信小程序客户端。 下面我就贴代码了。 package com.ssm.controller; import java.util.ArrayList; import java.util.List; import javax.json.JsonObject; import org.springframework.stereotype.Controller; import com.mybatis.daoImpl.*; import mybatis.simple.model.*; import com.fasterxml.jackson.databind.util.*; //注解@Controller表示它是一个控制器 上面的代码有一点注意的是,我返回的是list(列表),而我们 传输到客户端的应该是json数据,而list数据能转化为json数据很重要的便是 使用了@ResponseBody这个注解。这个注解会把放回的数据转化为json或xml格式。 下面就说到客户端了: Page({ onLoad: function (options) { wx.request({ url: 'http://localhost:8080/bnuzMutualAssistant_server_ssm_Wukesong/myLogin', data: { list:[] }, method: 'POST', dataType: 'json', header: { 'content-type': 'application/json' }, success: (res) => { this.setData({ list: res.data,//将表中查询出来的信息传给list }) } }) }, }) request是发送请求,如果发送请求后便调用success,this.setData是把返回的res.data数据赋给list 现在说一下tarbar,这个是微信小程序底端的两个按钮,它们其实就是一个列表,数量大于或等于2,小于或等于5。 在app.json这里添加这个代码: "tabBar": { "selectedColor": "#1296db", "list": [ { "pagePath": "pages/loginMain/loginMain", "text": "帖子列表", "iconPath": "pages/images/loginMain.png", "selectedIconPath": "pages/images/loginMain.png" }, { "pagePath": "pages/userInfo/userInfo", "text": "个人中心", "iconPath": "pages/images/userInfo.png", "selectedIconPath": "pages/images/userInfo.png" } ] } 还要说到一个页面跳转tarbar的功能:使用wx.switchTab(这个是专门用来跳转tarbar界面的),不要使用navigate。 index.js goToLoginMain:function() { wx.switchTab({ url: '/pages/loginMain/loginMain' }) }
index.wxml <view class="goToLoginMain"> <button bindtap="goToLoginMain">登录</button> </view>
注意,如果在本机使微信小程序和ssm服务端通信的话,可以不使用https,其中进行如下配置: 勾上这个勾~~~ 还有点击帖子列表查看帖子具体内容: <view class='container'> <loading hidden="{{!loading}}">加载中</loading> <block class="" wx:for="{{list}}" wx:key="id" data-index="{{index}}"> <navigator url='/pages/tableInfo/tableInfo?postId={{item.postId}}'> <view hover-class='hover-class' id="{{item.postId}}" style='display:flex; height:120px;border-bottom: 1px solid #DBDBDB'> <!--左边图片--> <view style='width:128rpx; height:128rpx; margin:20rpx;'> <image class='index-logo' style='width:128rpx; height:128rpx' src="/pages/images/logo1.jpg"></image> </view> <!-- 右边内容 上下结构 --> <view style='display:flex; flex-direction:column; margin:20rpx;'> <label class='item_title'>{{item.title}}</label> <label class='item_content'>{{item.content}}</label> <!-- 右边底部内容 左右结构 --> <view style='display:flex; flex-direction:row; height:40rpx;'> <label class='item_from'>{{item.userId}}</label> <label class='item_time'></label> </view> </view> </view> </navigator> </block> </view> navigator就是跳转帖子列表,加上一个postId,帖子id的参数。 Page({ data: { postId : null }, onLoad: function (options) { var that = this that.setData({ postId : options.postId, }), wx.request({ url: 'http://localhost:8080/bnuzMutualAssistant_server_ssm_Wukesong/getTable?postId='+that.data.postId, data: { list: [] }, method: 'POST', dataType: 'json', header: { 'content-type': 'application/json' }, success: (res) => { this.setData({ list: res.data,//将表中查询出来的信息传给list }) } }) } }) 取出参数,发送请求到客户端,通过这个postId查询指定的帖子,返回给客户端
|
请发表评论