wx

130 阅读4分钟

news 添加/删除:newlist # 注册:register 登录: login 修改: editnews 添加/删除:newlist

注册:register.js ----- // pages/register/register.js Page({ // 4、编辑注册页面的js文件,自定义submit函数 submit(e){ // 5、编辑注册页面的js文件,在submit // 函数中获取用户填写的数据 username\password\password2 并校验合法性 let username=e.detail.value.username let password=e.detail.value.password let password2=e.detail.value.password2 console.log(username,password,password2); if(username.length == 0){ wx.showToast({ title: '用户名不能为空', icon:'error' }) return } if(password.length == 0){ wx.showToast({ title: '密码不能为空', icon:'error' }) return } if(password2.length == 0){ wx.showToast({ title: '确认密码不能为空', icon:'error' }) return } if(password != password2){ wx.showToast({ title: '密码不一致', icon:'error' }) return } // 6、编辑注册页面的js文件,在submit函数中访问注册API,并提交相关数据 wx.request({ url: 'dev.baibaisi.com/cms/registe…', method:'POST', data:{ username:username, password:password, password2:password2 }, // 7、编辑注册页面的js文件,在wx.request中分别处理成功 // 和失败的情况,业务失败的给出提示,业务成功则跳转到登录页 success:res=>{ // 接口访问成功 包含: 业务成功 和业务失败 两种情况 console.log(res); // 1.通过状态码来表示业务成(200) 业务失败(500) if(res.statusCode == 200){ // 业务成功 wx.redirectTo({ url: '/pages/login/login', }) }else if(res.statusCode == 500){ // 业务失败 wx.showToast({ title: res.data.message, icon:'none' }) }else if(res.statusCode == 404){ // 接口不存在 }else if(res.statusCode == 403){ // 权限不足 }else{ // 失败 } // 2.通过返回json的约定字段, errpr_code 来表示 业务成功(0) 业务失败(5000x) // if(res.data.error_code == 0){ // 业务成功 // }else{ // 失败 // } }, fail:err=>{ // 接口访问失败 }, complete:()=>{ // 访问成功 } }) } })

register.wxml--

用户名: 密码: 确认密码: 注册

register.wxss --- form{ /* pages/register/register.wxss */ form{ width: 70%; } input{ border: 1px solid #ccc; margin-bottom: 20rpx; }

登录: login login.js-- Page({ // 4、编辑注册页面的js文件,自定义submit函数 submit(e){ // 5、编辑注册页面的js文件,在submit // 函数中获取用户填写的数据 username\password\password2 并校验合法性 let username=e.detail.value.username let password=e.detail.value.password console.log(username,password); if(username.length == 0){ wx.showToast({ title: '用户名不能为空', icon:'error' }) return } if(password.length == 0){ wx.showToast({ title: '密码不能为空', icon:'error' }) return } // 6、编辑登录页面的js文件,在submit函数中访问登录API,并提交相关数据 wx.request({ url: 'dev.baibaisi.com/cms/login', method:'POST', data:{ username:username, password:password }, success:res=>{ // 接口访问成功 包含: 业务成功 和业务失败 两种情况 console.log(res); // 1.通过状态码来表示业务成(200) 业务失败(500) if(res.statusCode == 200){ // 业务成功 let token = res.data.data.token wx.setStorageSync('token', token) wx.redirectTo({ url: '/pages/newList/newList', }) }else if(res.statusCode == 500){ // 业务失败 wx.showToast({ title: res.data.message, icon:'none' }) }else if(res.statusCode == 404){ // 接口不存在 }else if(res.statusCode == 403){ // 权限不足 }else{ // 失败 } // 2.通过返回json的约定字段, errpr_code 来表示 业务成功(0) 业务失败(5000x) // if(res.data.error_code == 0){ // 业务成功 // }else{ // 失败 // } }, fail:err=>{ // 接口访问失败 }, complete:()=>{ // 访问成功 } }) } })

register.wxml --

用户名: 密码: 登录

register.wxss -- /* pages/register/register.wxss */ form{ width: 70%; } input{ border: 1px solid #ccc; margin-bottom: 20rpx; }

修改: editnews editnews.js -- 4// pages/editnews/editnews.js Page({ data: { id: '', title: '', content: '' }, onLoad(options) { let id = options.id this.setData({ id: id }) this.getData() }, getData() { let id = this.data.id wx.request({ url: 'dev.baibaisi.com/cms/news/' + id, method: 'GET', success: res => { if (res.statusCode == 200) { this.setData({ title: res.data.data.title, content: res.data.data.content }) } else { wx.showToast({ title: res.data.message, icon: 'none' }) } }, fail: err => { wx.showToast({ title: err.data.message, }) } }) }, submit(e) { let title = e.detail.value.title let content = e.detail.value.content // console.log(title,content) if (title.length == 0) { wx.showToast({ title: '标题不能为空', icon: "error" }) return } if (content.length == 0) { wx.showToast({ title: '正文不能为空', icon: "error" }) return } let id =this.data.id let token = wx.getStorageSync('token') let data = { title: title, content: content } wx.showLoading({ title: '加载中...', }) wx.request({ url: 'dev.baibaisi.com/cms/news/'+…, method: 'PUT', header: { token: token }, data, success:res => { console.log(res) if (res.statusCode == 200) { wx.redirectTo({ url: '/pages/newList/newList', }) }else{ wx.showToast({ title: res.data.message, icon:"none" }) } }, fail:err => { wx.showToast({ title: err.data.message, icon:'none' }) }, complete:()=>{ wx.hideLoading() } }) } })

editnews.wxml --

标题: 正文: <button form-type="submit" >提交</button> </view> </form> </view> editnews.wxss -- /* pages/editnews/editnews.wxss */ page{ height: 100vh; display: flex; flex-direction: column;

} .box{ height: 100%;

} .formbox{ background-color: cadetblue; height: 100%; display: flex; padding: 0 10px; flex-direction: column; } input,textarea{ width: 100%; border: 1px solid #ccc; } button{ margin-top: 10px; } textarea{ flex-grow: 1; }

添加/删除:newlist newList.js -- // pages/newList/newList.js Page({

data: { list:[] }, onLoad(){ this.getlist() }, getlist(){ wx.request({ url: 'dev.baibaisi.com/cms/news', method:'GET', success:res=>{ console.log(res); this.setData({ list: res.data.data.items }) }, fail:err=>{

  },
  complete:()=>{
    wx.hideLoading()
  }
})

}, gotoAdd(){ wx.navigateTo({ url: '/pages/addnews/addnews', }) }, deleteNews(e){ console.log(e.currentTarget.dataset.id); let id = e.currentTarget.dataset.id let token = wx.getStorageSync('token') let index = e.currentTarget.dataset.index wx.request({ url: 'dev.baibaisi.com/cms/news/'+…, method:'DELETE', header:{token:token}, success:res=>{ console.log(res); if(res.statusCode == 200){ wx.showToast({ title:'删除成功', icon:'none' }) // this.getlist() let list = this.data.list let n = list.splice(index,1) console.log(n); this.setData({ list:list }) }else{ wx.showToast({ title: res.data.message, icon:'none' }) } }, fail:err=>{ // 接口访问失败 }, complete:()=>{

  },
  
})

}, editNews(e){ let id = e.currentTarget.dataset.id wx.navigateTo({ url: '/pages/editnews/editnews?id='+id, }) }
})

newList.wxml --

添加新闻 添加新闻 {{ item.title }} {{ utils.fixDate(item.pubtime) }}
  </navigator>
  <button size="mini" type="default" bindtap="editNews" data-id="{{item.id}}">修改</button>
  <button size="mini" type="warn" bindtap="deleteNews" data-index="index" data-id="{{item.id}}">删除</button>
  
</view>

newList.wxss -- /* pages/newList/newList.wxss */ page{ overflow: visible; } .box{ padding: 0 10px; } .item{ border-bottom: 1px solid gainsboro; display: flex; margin-bottom: 10px; flex-direction: row; } .item_text{ display: flex; flex-grow: 1; flex-direction: column; } .title{

font-weight: bold; } .date{ font-size: 12px; color: gray; }