【无标题】微信小程序扫描二维码的内容，作为参数跳转填入到下一个页面input框
2021/12/13 17:16:36
本文主要是介绍【无标题】微信小程序扫描二维码的内容，作为参数跳转填入到下一个页面input框，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！
scan.wxml
<view class="container">
<view class='imagesize'>
<image class='img' bindtap='getScancode' src="{{back}}">
</image>
</view>
<view style="display: flex;justify-content: center;">请扫描卡号
</view>
<!-- <view wx:if="{{result !=''}}">
<view>扫码的内容:{{result}}</view>
</view> -->
<navigator url="/pages/card/card" hover-class="changestyle">
<view class='imagesizehand'>
<image src="{{hand}}">
</image>
</view>
<view style="display: flex;justify-content: center;">手动输入卡号
</view>
</navigator>
</view>
scan.js
//index.js
//获取应用实例
const app =
getApp()
Page({
data: {
back:
"../../images/scanning.png",
hand:
"../../images/hand.png",
result:
''
},
onl oad:
function(
) {
},
getScancode:
function(
) {
var _this =
this;
// 允许从相机和相册扫码
wx.
scanCode({
success:
(res) => {
var result = res.
result;
_this.
setData({
result: result,
})
//在回调函数里面，将获得的返回值，带到下一个界面里面去
//三秒钟之后跳转到主界面
setTimeout(
function (
) {
wx.
navigateTo({
url:
'../card/card?result=' + result
})
},
3000)
}
})
}
})
card.wxml
<form catchsubmit="confirmPublish">
<view class="search_arr">
<input maxlength="15" placeholder="请输入卡号" value="{{deviceId}}" data-name="deviceId" bindblur="setInput">
</input>
</view>
<button class='btn1' bindtap="bindViewTap" form-type="submit">绑定
</button>
</form>
card.js
// pages/card/card.js
Page({
/**
* 页面的初始数据
*/
data: {
id:
1,
deviceId:
'',
},
//事件处理函数
bindViewTap:
function(
) {
wx.
navigateTo({
url:
'../cardsuccess/cardsuccess'
})
//三秒钟之后跳转到主界面
setTimeout(
function(
) {
wx.
switchTab({
url:
'../index/index'
})
},
3000)
},
/**
* 生命周期函数--监听页面加载
*/
onl oad:
function(
options) {
console.
log(options)
// 生命周期函数--监听页面加载
this.
setData({
deviceId: options.
result,
})
},
confirmPublish:
function(
) {
// if (!this.data.taskName) {
// this.setData({ errortip: true, errorMsg: '任务名不能为空' })
// setTimeout(() => {
// this.setData({ errortip: false, errorMsg: '' })
// }, 2000)
// return
// }
// const data = {}
// data.id = this.data.id
// data.deviceId = this.data.deviceId
var params = {
id:
1,
deviceId:
"12345678",
}
wx.
request({
url:
'http://192.xxx.4.103:8093/cs-applet/subscribe/bindingCard',
method:
'PUT',
data: params,
dataType:
"json",
success:
function(
res) {
// console.log(res)
// if (res.data.code === "0001") {
// wx.showToast({
// title: res.data.msg,
// icon: 'none',
// duration: 2000
// })
// return;
// }
// wx.showToast({
// title: '添加成功',
// icon: 'success',
// duration: 2000
// })
// setTimeout(() => {
// wx.switchTab({
// url: "/pages/index/index?refresh=true",
// });
// }, 1000);
},
fail:
function(
error) {
wx.
showToast({
title: error.
message ||
'保存失败'
})
console.
log(error)
}
})
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady:
function(
) {
},
/**
* 生命周期函数--监听页面显示
*/
onShow:
function(
) {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide:
function(
) {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload:
function(
) {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh:
function(
) {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom:
function(
) {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage:
function(
) {
}
})
原文作者：祈澈姑娘。 技术博客：https://wangxiaoting.blog.csdn.net/article/details/118542635
90后前端妹子。
这篇关于【无标题】微信小程序扫描二维码的内容，作为参数跳转填入到下一个页面input框的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！
- 2024-11-22微信小程序的接口信息py可以抓到吗？-icode9专业技术文章分享
- 2024-11-22怎样解析出微信小程序二维码带的参数？-icode9专业技术文章分享
- 2024-11-22微信小程序二维码怎样解析成链接？-icode9专业技术文章分享
- 2024-11-22微信小程序接口地址的域名需要怎么设置？-icode9专业技术文章分享
- 2024-11-22微信小程序的业务域名有什么作用-icode9专业技术文章分享
- 2024-11-22微信小程序 image有类似html5的onload吗？-icode9专业技术文章分享
- 2024-11-22微信小程序中怎么实现文本内容超出行数后显示省略号？-icode9专业技术文章分享
- 2024-11-22微信小程序怎么实现分享样式定制和图片定制功能？-icode9专业技术文章分享
- 2024-11-20微信小程序全栈教程：从零开始的全攻略
- 2024-11-19微信小程序全栈学习：从零开始的完整指南
