6. いくつかの重要な点が必要です理解していただくために、
b. 他の属性は前の HTML と同様です。フォームには name="value" が必要であり、バックエンド処理は前と同じであることに注意してください。たとえば、name="username" です。 $_POST[ 'username'] を使用して受信できます。 C. ミニ プログラムには入力送信ボタンがないため、各フォームに送信ボタンが必要です。
, このボタンは、送信イベントを開くために使用されます。
7.index.js コード
Page({
data: {
},
formSubmit: function(e) {
if(e.detail.value.mobile.length==0||e.detail.value.password.length==0){
wx.showToast({
title: '手机号码或密码不得为空!',
icon: 'loading',
duration: 1500
})
setTimeout(function(){
wx.hideToast()
},2000)
}else if(e.detail.value.mobile.length != 11){
wx.showToast({
title: '请输入11位手机号码!',
icon: 'loading',
duration: 1500
})
setTimeout(function(){
wx.hideToast()
},2000)
}else if(e.detail.value.password.length <6 ||e.detail.value.password.length>20){
wx.showToast({
title: '请输入6-20密码!',
icon: 'loading',
duration: 1500
})
setTimeout(function(){
wx.hideToast()
},2000)
}else if(e.detail.value.password != e.detail.value.repassword){
wx.showToast({
title: '两次密码输入不一致!',
icon: 'loading',
duration: 1500
})
setTimeout(function(){
wx.hideToast()
},2000)
}else{
wx.request({
url: 'https://shop.yunapply.com/home/Login/register',
header: {
"Content-Type": "application/x-www-form-urlencoded"
},
method: "POST",
data:{mobile:e.detail.value.mobile,password:e.detail.value.password},
success: function(res) {
if(res.data.status == 0){
wx.showToast({
title: res.data.info,
icon: 'loading',
duration: 1500
})
}else{
wx.showToast({
title: res.data.info,//这里打印出登录成功
icon: 'success',
duration: 1000
})
}
}
})
}
},
}) ログイン後にコピー
##8 に注意する必要があります。 Page () このメソッドは、ページのロード時に効果を表示するために js オブジェクトを配置します。データ オブジェクトは、フロントエンドで設定できます。このオブジェクトを読み込むと内部のデータが表示されます。
formSubmit: function ミニ プログラム内のメソッドはすべてメソッド名: function() です。ここで、function は現在の時刻をトリガーするオブジェクトとしてパラメーターを渡すことができます。
以下は実行です。機能の検証のため、多すぎるので一部のみ抜粋してご紹介します。
if(e.detail.value.mobile.length==0||e.detail.value.password.length==0){
wx.showToast({
title: '手机号码或密码不得为空!',
icon: 'loading',
duration: 1500
}) ログイン後にコピー
ここでの e は、HTML の onclick="foo(this)" と同様に、現在イベントをトリガーするオブジェクトです。アプレットは多くのオブジェクトをカプセル化します。組み込み 呼び出しメソッド、e.detail.value.mobile は現在のオブジェクトの値 name="mobile" e.detail.value.mobile.length はこの値の長さ
showToast と同様JS でアラートするには、ポップアップ ボックス、タイトルはポップアップ ボックスに表示される情報、アイコンはポップアップ ボックスのアイコンの状態です。現在、状態は読み込み中と成功の 2 つだけです。期間は、ポップアップ ボックスが画面に表示される時間です。
9. ここが重要なポイントです。
wx.request({
url: 'https://shop.com/home/Login/register',
header: {
"Content-Type": "application/x-www-form-urlencoded"
},
method: "POST",
data:{mobile:e.detail.value.mobile,password:e.detail.value.password},
success: function(res) {
if(res.data.status == 0){
wx.showToast({
title: res.data.info,
icon: 'loading',
duration: 1500
})
}else{
wx.showToast({
title: res.data.info,//这里打印出登录成功
icon: 'success',
duration: 1000
})
}
},
fail:function(){
wx.showToast({
title: '服务器网络错误!',
icon: 'loading',
duration: 1500
})
}
}) ログイン後にコピー
wx.request({}) は、次のような小さなプログラムです。 https リクエストを開始します。http は使用できないことに注意してください。
ここで、
a.url はリクエストした URL です。たとえば、フロントエンドでは、POST フォームの action='index.php' であり、ここでのindex.php は相対パスです。 、およびアプレット 要求された URL は絶対ネットワーク パスである必要があります。 例: https://shop.com/home/Login/register
b.
header: {
"Content-Type": "application/x-www-form-urlencoded"
}, ログイン後にコピー
Due GET がデータを送信する方法とは異なり、POST のヘッダーは
##"Content-Type": "application/x-www-form-urlencoded"
## である必要があります。 #GET ヘッダーは「Accept」にすることができます: 'application/json'
c. 必ずメソッド「POST」を指定してください。デフォルトは「GET」です。大文字のままにしてください。
#data:{ mobile:e.detail.value.mobile,password:e.detail.value.password},
ここでのデータは、サーバーに POST 送信されたデータです。 {name:value} の形式
d. 成功コールバック関数
success: function(res) {
if(res.data.status == 0){
wx.showToast({
title: res.data.info,
icon: 'loading',
duration: 1500
})
}else{
wx.showToast({
title: res.data.info,
icon: 'success',
duration: 1000
})
}
} ログイン後にコピー
e.
success:function()リクエストのステータスによって正常にトリガーされたイベントです。また、200 の場合、リクエストの成功は、このプログラムからサーバーへの操作の成功を意味するものではないことに注意してください。
fail:function() は、ネットワーク リクエストが失敗したときにトリガーされるイベントです。
f.
if(res.data.status == 0){
wx.showToast({
title: res.data.info,
icon: 'loading',
duration: 1500
})
}else{
wx.showToast({
title: res.data.info,//这里打印出登录成功
icon: 'success',
duration: 1000
})
} ログイン後にコピー
ここのコードは、特定の PHP バックエンド プログラムに関連しています。プロセスはこのようなものです、1.POST通过数据到https://shop.com/home/Login/register这个接口,用过THINKPHP的就会知道是HOME模块下的Login控制下的register方法
2.register方法根据POST过来的数据,结合数据库进行二次验证,如果操作成功,返回什么,如果操作失败,返回什么
3.后端PHP代码如下:
控制器 LoginController.class.php
/**
* 用户注册
*/
public function register()
{
if (IS_POST) {
$User = D("User");
if (!$User->create($_POST, 4)) {
$this->error($User->getError(),'',true);
} else {
if ($User->register()){
$this->success('注册成功!','',true);
}else{
$this->error('注册失败!','',true);
}
}
}
} ログイン後にコピー
模型
UserModel.class.php 的register方法
public function register()
{
$mobile = I('post.mobile');
$password = I('post.password');
$res = D('User')->add(array(
'mobile'=> $mobile,
'password'=>md5($password),
'modifytime'=>date("Y-m-d H:i:s")
));
return $res;
} ログイン後にコピー
以上就是本文的全部内容,希望对大家的学习有所帮助,更多相关内容请关注PHP中文网!
相关推荐:
PHP
中TP5 Request的请求对象
php中反射的应用
PHP后端方法实现网页的分页下标生成代码
以上がWeChat ミニ プログラムでの PHP バックエンド フォームの送信の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。