小程序实现扫描二维码带着参数跳转到另外一个页面,实现对mysql数据库访问,并通过表格形式实现

使用场景:扫描公司内部公用车上的二维码,获取到vin号,同时链接到服务器上数据库,显示这辆车的使用人,使用时间,用途,同时可以实现对数据库的添加(备注:如果这辆车之前就存在在数据库中,则显示相关使用者的信息,如果是第一次扫描二维码,将自动将数据录入到数据库中),目前只实现了扫描二维码并且带着参数跳转页面,同时链接到数据库,显示信息,添加功能还没有实现。
效果预览如下:首页
小程序实现扫描二维码带着参数跳转到另外一个页面,实现对mysql数据库访问,并通过表格形式实现
点击按钮之后随便选择一张图片:小程序实现扫描二维码带着参数跳转到另外一个页面,实现对mysql数据库访问,并通过表格形式实现小程序实现扫描二维码带着参数跳转到另外一个页面,实现对mysql数据库访问,并通过表格形式实现
vin号后面就是二维码自身携带的信息,显示的是我在服务器服务器上自己建的数据库,添加按钮本来要实现的就是点击一下,可以实现添加一行数据,目前我现在还没有实现。
其他参数代码如下:
我总共有两个页面:
小程序实现扫描二维码带着参数跳转到另外一个页面,实现对mysql数据库访问,并通过表格形式实现
bind页面:
js代码
const app = getApp()
Page({
data: {
result: ‘’
},
onLoad: function () {
},
getScancode: function () {
var _this = this;
// 允许从相机和相册扫码
wx.scanCode({
success: (res) => {
wx.navigateTo({
url: ‘…/bind/bind?title=’ + res.result
})
var result = res.result;
_this.setData({
result: result,
})
}
})
}
})
wxml代码
扫描车身二维码
wxss代码
.Scancode {
font-size: 39rpx;
background: #aaa;
position: fixed;
bottom: 1000rpx;
display: flex;
width: 90%;
justify-content: center;

color: #fff;
border-radius:59rpx;
margin-left:30rpx;
margin-right: 30rpx;
z-index:999;
}
index页面
js代码
Page({
data: {
focus: false,
inputValue: ‘’,
items: []
},
onLoad: function (options) {
// 生命周期函数–监听页面加载
var that = this;
wx.request({
url: ‘你自己的网址’,
header: {
‘content-type’: ‘application/xml’ // 默认值
},
success(res) {
console.log(res.data);
that.setData({
list: res.data
})
},
})
this.setData({
title: options.title

})

}
})
wxml代码


vin号:

添加



使用人
日期
用途



{{item.name}}
{{item.time}}
{{item.object}}


{{item.name}}
{{item.time}}
{{item.object}}




wxss代码
.search{
display: flex;
flex-direction: row;
}
.yangshi {

float: left;
font-size: 26rpx;
}
.vin {
margin-top: 7rpx;
font-size: 26rpx;
}
.add{
margin-left: 250rpx;
float: right;
margin-top: 7rpx;
font-size: 26rpx;
}
.table {
border: 0px solid darkgray;
font-size: 12px;
height: 100rpx;
}
.tr {
display: flex;
width: 100%;
justify-content: center;
height: 2rem;
align-items: center;
}
.td {
width:40%;
justify-content: center;
text-align: center;
}
.bg-w{
background: snow;
}

.th {
width: 40%;
justify-content: center;
background: rgb(94, 99, 112);
color: #fff;
display: flex;
height: 2rem;
align-items: center;
}
app.json代码:
{
“pages”: [
“pages/index/index”,
“pages/bind/bind”

],
“window”: {
“backgroundTextStyle”: “light”,
“navigationBarBackgroundColor”: “#fff”,
“navigationBarTitleText”: “车联网”,
“navigationBarTextStyle”: “black”
}
}
服务器需要自己弄好,并且要用php配好,
php代码如下:

<?php //$name=$_GET[“name”];//接收参数 $hostname_conn = "自己的数据库的ip地址"; $database_conn = "自己的数据库名";//自己建数据库名 $username_conn = "root"; $password_conn = "数据库的密码"; //连接MYSQL数据库 $conn = mysqli_connect($hostname_conn, $username_conn, $password_conn,$database_conn)or trigger_error(mysqli_error(),E_USER_ERROR); if(!$conn){ echo '连接不成功!'; } $sql = "SELECT * FROM vin"; mysqli_query($conn, "set names 'utf8'"); $result = mysqli_query($conn, $sql); class Vin{ public $id; public $name; public $time; public $vin; public $object; } $data = array(); if (mysqli_num_rows($result) > 0) { while($row = mysqli_fetch_assoc($result)) { $vin=new Vin(); $vin->id=$row['id']; $vin->name=$row['name']; $vin->time=$row['time']; $vin->vin=$row['vin']; $vin->object=$row['object']; $data[] = $vin; } echo json_encode($data,JSON_UNESCAPED_UNICODE|JSON_PRETTY_PRINT);//将请求结果转换为json格式 } ?>

等添加按钮实现之后我再来更新。