div タグコンポーネントの V モデル

Question

v-model を div タグに使用する際に問題が発生しました。どうやら、div タグでは v-model が許可されていないため、コメント セクションをコンポーネントとして作成することにしました。 UI/UX の理由から、この div テキストエリアをそのまま割り当てる必要があります。 textarea、input およびその他のタグは、私の知る限り、これらのタグは contenteditable="true"; と互換性がありません。ユーザーがコメントを入力する 入力フィールドの高さ。以下は、親ビューにインポートした vue コンポーネントです。

リーリー

私のビュー ファイルでは、このようにインポートして v-model を使用します。

リーリー

しかし、コンソールを確認すると、値「null」または何も表示されません。この問題を解決する方法はありますか?あるいは、私が実装した方法が問題を引き起こしているのかもしれません。

編集: これは、codesandbox で実行されているコードです。

Answer 1

問題は解決しました。コードは次のとおりです。これがお役に立てば幸いです

divタグ内に@を追加すると、changeメソッドでタグ内容の変更が確認できます。このメソッドでは、emit$ を使用してその値を他のコンポーネントと共有します

リーリー

ここでは $emit によって作成された props があり、その値をコメント変数で初期化します。実はv-modelと同様の機能を持っています。

リーリー