【无标题】微信小程序扫描二维码的内容,作为参数跳转填入到下一个页面input框

scan.wxml


   
    
    
  1. <view class="container">
  2. <view class='imagesize'>
  3. <image class='img' bindtap='getScancode' src="{ {back}}"> </image>
  4. </view>
  5. <view style="display: flex;justify-content: center;">请扫描卡号 </view>
  6. <!-- <view wx:if="{ {result !=''}}">
  7. <view>扫码的内容:{ {result}}</view>
  8. </view> -->
  9. <navigator url="/pages/card/card" hover-class="changestyle">
  10. <view class='imagesizehand'>
  11. <image src="{ {hand}}"> </image>
  12. </view>
  13. <view style="display: flex;justify-content: center;">手动输入卡号 </view>
  14. </navigator>
  15. </view>

scan.js


   
    
    
  1. //index.js
  2. //获取应用实例
  3. const app = getApp()
  4. Page({
  5. data: {
  6. back: "../../images/scanning.png",
  7. hand: "../../images/hand.png",
  8. result: ''
  9. },
  10. onLoad: function( ) {
  11. },
  12. getScancode: function( ) {
  13. var _this = this;
  14. // 允许从相机和相册扫码
  15. wx. scanCode({
  16. success: (res) => {
  17. var result = res. result;
  18. _this. setData({
  19. result: result,
  20. })
  21. //在回调函数里面,将获得的返回值,带到下一个界面里面去
  22. //三秒钟之后跳转到主界面
  23. setTimeout( function ( ) {
  24. wx. navigateTo({
  25. url: '../card/card?result=' + result
  26. })
  27. }, 3000)
  28. }
  29. })
  30. }
  31. })

card.wxml


   
    
    
  1. <form catchsubmit="confirmPublish">
  2. <view class="search_arr">
  3. <input maxlength="15" placeholder="请输入卡号" value="{ {deviceId}}" data-name="deviceId" bindblur="setInput"> </input>
  4. </view>
  5. <button class='btn1' bindtap="bindViewTap" form-type="submit">绑定 </button>
  6. </form>

card.js


   
    
    
  1. // pages/card/card.js
  2. Page({
  3. /**
  4. * 页面的初始数据
  5. */
  6. data: {
  7. id: 1,
  8. deviceId: '',
  9. },
  10. //事件处理函数
  11. bindViewTap: function( ) {
  12. wx. navigateTo({
  13. url: '../cardsuccess/cardsuccess'
  14. })
  15. //三秒钟之后跳转到主界面
  16. setTimeout( function( ) {
  17. wx. switchTab({
  18. url: '../index/index'
  19. })
  20. }, 3000)
  21. },
  22. /**
  23. * 生命周期函数--监听页面加载
  24. */
  25. onLoad: function( options) {
  26. console. log(options)
  27. // 生命周期函数--监听页面加载
  28. this. setData({
  29. deviceId: options. result,
  30. })
  31. },
  32. confirmPublish: function( ) {
  33. // if (!this.data.taskName) {
  34. // this.setData({ errortip: true, errorMsg: '任务名不能为空' })
  35. // setTimeout(() => {
  36. // this.setData({ errortip: false, errorMsg: '' })
  37. // }, 2000)
  38. // return
  39. // }
  40. // const data = {}
  41. // data.id = this.data.id
  42. // data.deviceId = this.data.deviceId
  43. var params = {
  44. id: 1,
  45. deviceId: "12345678",
  46. }
  47. wx. request({
  48. url: 'http://192.xxx.4.103:8093/cs-applet/subscribe/bindingCard',
  49. method: 'PUT',
  50. data: params,
  51. dataType: "json",
  52. success: function( res) {
  53. // console.log(res)
  54. // if (res.data.code === "0001") {
  55. // wx.showToast({
  56. // title: res.data.msg,
  57. // icon: 'none',
  58. // duration: 2000
  59. // })
  60. // return;
  61. // }
  62. // wx.showToast({
  63. // title: '添加成功',
  64. // icon: 'success',
  65. // duration: 2000
  66. // })
  67. // setTimeout(() => {
  68. // wx.switchTab({
  69. // url: "/pages/index/index?refresh=true",
  70. // });
  71. // }, 1000);
  72. },
  73. fail: function( error) {
  74. wx. showToast({
  75. title: error. message || '保存失败'
  76. })
  77. console. log(error)
  78. }
  79. })
  80. },
  81. /**
  82. * 生命周期函数--监听页面初次渲染完成
  83. */
  84. onReady: function( ) {
  85. },
  86. /**
  87. * 生命周期函数--监听页面显示
  88. */
  89. onShow: function( ) {
  90. },
  91. /**
  92. * 生命周期函数--监听页面隐藏
  93. */
  94. onHide: function( ) {
  95. },
  96. /**
  97. * 生命周期函数--监听页面卸载
  98. */
  99. onUnload: function( ) {
  100. },
  101. /**
  102. * 页面相关事件处理函数--监听用户下拉动作
  103. */
  104. onPullDownRefresh: function( ) {
  105. },
  106. /**
  107. * 页面上拉触底事件的处理函数
  108. */
  109. onReachBottom: function( ) {
  110. },
  111. /**
  112. * 用户点击右上角分享
  113. */
  114. onShareAppMessage: function( ) {
  115. }
  116. })

原文作者:祈澈姑娘。 技术博客:https://wangxiaoting.blog.csdn.net/article/details/118542635
90后前端妹子。

猜你喜欢

转载自blog.csdn.net/minweiguo/article/details/121909151