首先这里有一个小程序js传值的简单讲解http://blog.csdn.net/weixin_40024174/article/details/77853107
然后我通过这个js传值,发现可以很简单的让小程序通过php连接mySQL,刚接触php,对php还是很混乱。接下来就是实例的代码,希望能够帮助跟我一样的小白。。
wxxcw.php文件
<?php
$mysql_server_name="localhost"; //数据库服务器名称
$mysql_username="root"; // 连接数据库用户名
$mysql_password="123lj"; // 连接数据库密码
$mysql_database="wxxcx"; // 数据库的名字
// 连接到数据库
$conn=mysqli_connect($mysql_server_name, $mysql_username,$mysql_password,$mysql_database);
if($conn){
echo"成功连接数据库";
}
if(!$conn) {
echo "数据库连接失败!". mysqli_connect_error();
}
$name=$_POST["registeridInput"];
$psp=$_POST["registerpasswordInput"];
$sql = "INSERT INTO student VALUES ('1',$name,'Doe',$psp)";
if ($conn->query($sql) === TRUE) {
echo "新记录插入成功";
} else {
echo "Error: " . $sql . "<br>" . $conn->error;
}
$conn->close();
?>
.js文件
Page({
/**
* 页面的初始数据
*/
data: {
registeridInput: '',
registerpasswordInput: '',
passwordInput2: ''
},
// 获取输入账号
registeridInput: function (e) {
this.setData({
registeridInput: e.detail.value
})
},
// 获取输入密码
registerpasswordInput: function (e) {
this.setData({
registerpasswordInput: e.detail.value
})
},
// 获取输入重复
passwordInput2: function (e) {
this.setData({
passwordInput2: e.detail.value
})
},
// 注册
register: function (e) {
var that = this
wx.request({
//上线接口地址要是https测试可以使用http接口方式
url: 'http://localhost/text1.php',
data: {
registeridInput:that.data.registeridInput,
registerpasswordInput:that.data.registeridInput,
},
method:"POST",
header: {
'content-type': 'application/x-www-form-urlencoded'
},
success: function (res) {
console.log(res.data)
},
})
} ,
.wxml文件
<!--pages/one/one.wxml-->
<view class="registercontainer">
<view class="register-from">
<!--账号-->
<view class="registerinputView">
<label class="registerLab">账号</label>
<input class="registerinputText" placeholder="请输入账号" bindinput="registeridInput" />
</view>
<view class="registerline"></view>
<!--密码-->
<view class="registerinputView">
<label class="registerLab">密码</label>
<input class="registerinputText" password="true" placeholder="请输入密码" bindinput="registerpasswordInput" />
</view>
<view class="registerline"></view>
<!--重复密码-->
<view class="registerinputView">
<label class="registerLab">重复密码</label>
<input class="registerinputText" password="true" placeholder="请再一次输入密码" bindinput="passwordInput2" />
</view>
<!--注册按钮-->
<view class="regBtnView"> <button class="regBtn" type="primary" size="{{primarySize}}" loading="{{loading}}" plain="{{plain}}" disabled="{{disabled}}" bindtap="register">注册</button>
</view>
</view>
</view>
.wxss文件
page{
height: 100%;
}
.registercontainer {
height: 100%;
display: flex;
flex-direction: column;
padding: 0;
box-sizing: border-box;
}
/*登录背景图片*/
.register-icon{
position:fixed;
top:0;
left:0;
bottom:0;
right:0;
z-index:-1;
}
.register-img{
height:100%;
width:100%;
border:0;
}
/*表单内容*/
.register-from {
margin-top: 250px; /*输入框与顶部的距离*/
flex: auto;
height:100%;
}
.registerinputView {
background-color: #fff;
line-height: 44px;
width:80%;
margin:auto;
}
/*输入图标*/
.registername, .registerid , .registerkey , .registerkey2 {
margin-left: 20px;
width: 14px;
height: 14px
}
.registerLab { /*框内文字*/
margin: 15px 15px 15px 10px;
color: #545454;
font-size: 14px
}
.registerinputText {
flex: block;
float:right;
text-align: right;
margin-right: 22px;
margin-top: 11px;
color: #cccccc;
font-size: 14px
}
.registerline { /*两个输入框之间的距离*/
width: 80%;
height: 1px;
margin:auto;
background-color: #cccccc;
margin-top: 1px;
}
/*注册*/
.regBtnView {
width: 60%;
height: auto;
margin: auto;
background-color: #006400;
margin-top: 0px;
margin-bottom: 0px;
padding-bottom: 0px;
}
.regBtn {
width: 100%; /*这里100%是相对于注册区域中的width*/
margin-top: 35px;
}
还和我之前一样没搭建服务器的超级小白的话建议将apache服务器、mysql数据库、php下载好,然后下载Wampserver32就不用去配置apache、mysql、php了。(Wampserver32下载的话我就直接百度,下载的百度助手里面的)
再推荐一个网址学习php,嘿嘿
https://m.runoob.com/php/
刚刚接触小程序和php之类的,希望大神路过的话多多指正。。