微信ウィジェットbindinputとbindsubmitの区別例の分析

1819 ワード

本明細書の例では、微信ウィジェットbindinputとbindsubmitの違いについて説明する.皆さんの参考にしてください.具体的には以下の通りです.
実際にはbindinputやbindsubmitには比べものにならないが、両者はよく比較される.なぜ?
例えば簡単な検索ボックスでbindinputを使うかbindsubmitを使うかを選択しますか?1つはフォームで、1つはテキスト入力ボックスですが、どちらもユーザーの入力情報を取得できる共通点があります.この時、問題が来ました.違いはどこですか.
最も簡単なコードは次のとおりです.

送信ボタン
送信ボタン

// pages/input/input.js
Page({
 data: { input1: "", input2: "" },
 input1input: function (e) {
  console.log(e);
  console.log(e.detail.value.input1)
 },
 input2input: function (e) {
  console.log(e);
  console.log(e.detail.value);
 }
})


何が簡単なのか、それでは問題が来て、違いはどこですか.
もちろん、一時的な違いは一つしかありません.console.logが多いです.ははは、冗談です.深圳側のお客様の反応によると、inputを使うとき、カーソルを一つの場所に移動した後、文字を入力すると、カーソルの末尾が再び移動します.もちろん、上のコードではありません.上のコードは大丈夫です.
問題は次のコードです.

// pages/input/input.js
Page({
 data: { input1: "this is the value for input1", input2: "this is the value for input2" },
 input1input: function (e) {
  console.log(e);
  console.log(e.detail.value.input1);
  this.setData({ input1: e.detail.value.input1 })
 },
 input2input: function (e) {
  console.log(e);
  console.log(e.detail.value);
  this.setData({ input2: e.detail.value })
 }
})


送信ボタン
送信ボタン
実は原因はとても简単で、1つの地方で、インタフェースのthis.setDataをリフレッシュして、どうしてですか?リフレッシュ後、value値が変更されたので、その後は?
そしてページが更新され、その後は?それから、カーソルが最后の一歩に自动的に移动するように设定されているので、一番いいのはinputを使うときに気をつけてくださいね.もちろん、inputを使うのはsubmitを使わないほうがいいというわけではありませんが、シーンの违いに适応しているだけです.例えば、bindinputを使う必要がないときにインタフェースをリフレッシュしたり、个人的にbindsbmitを使うのが好きなのではないでしょうか.
本文で述べたことは、皆さんの微信ウィジェットの開発に役立つことを望んでいます.