ユーザーが vue アプリケーションに登録できるようにする簡単な登録エンドポイントがあります。また、バックエンドから vue クライアントに適切なエラーを表示したいと考えています。
エラーの JSON 構造は次のとおりです:
リーリー次のようなレジスタ関数を持つコンポーザブルがあります:
リーリーまた、v-models が追加された単純なフォームであるフォーム コンポーネントもあります。 リーリー
私のコンポーザブルでは、次のようにエラー応答をログアウトできますエラー応答
フォームコンポーネントでエラーの登録を解除しようとしましたが、空のオブジェクトが返されるだけです (コンポーザブルでこのエラーオブジェクトを処理するためにリアクティブを使用しています)
コンポーザブルアイテムからの空のオブジェクト応答
P粉5761849332023-09-07 12:38:14
オブジェクトではなく配列を返しているようです。
したがって、アクセスするには、errors[0].Password を実行する必要があります。
オブジェクトを使用しますか? それとも配列を使用しますか (複数のエラーがある場合に役立つ可能性があります)?
配列が予期されており、すべてのエラーについて Password プロパティをチェックする必要がある場合は、次のようなことを実行します。
リーリー
P粉1808446192023-09-07 09:50:32
この内容には複数の誤りがあるため、お客様のニーズに合った簡潔な回答を提供することが困難です。代わりに、原則に従って機能するコードスニペットを簡単にまとめました。今後、注意すべき点を明らかにし、将来に向けた良いアドバイスを提供したいと考えています。
async function() を使用して、Promise
console.log で async を使用していることがわかります) これはすぐには結果が得られません。別のスレッドで実行するには時間がかかります。その結果、JavaScript スクリプトはほぼ即座に処理を進めます。応答がまだ到着していないために結果をすぐに使用したい場合、通常、これはエラーになります。
したがって、errors の新しい結果にアクセスしようとすると、console.log の後でも 1 ～ 2 秒後には空であることがわかります。空ではなくなります。 register() が実行されました。
- MDN ドキュメント
非同期関数 - 必要なもの
await の使用 - MDN ドキュメント
- VueJS で ref() を使用するにはどうすればよいですか?
、compulated() などの保存された値を変更できない変数に保存します。 。これらの変数を宣言するときは、常に const を使用してください。
詳細情報 - StackOverflow Answers
- VueJS ドキュメント
概要ロジックを含むサンプルコード
コードをよりよく理解するために、これらの行をコメント化しました。これは理解できると思います。