Vue jsと動的コンポーネントとコンテンツ

私のプロジェクトでは、VueJSにModalウィンドウを実装したいと思います。私はいつものjQueryで行ったように：AJAX経由Vue jsと動的コンポーネントとコンテンツ

から

追加HTMLコードしかしVueJSは異なるロジックを持っており、完全に動的なモーダルウィンドウを作成する方法は本当にわかりません。

私はだから私はそれをどのように行うことができます

<slot></slot>.

をモーダルウィンドウコンポーネントを作成し、体にそれを追加し、しかし、私は

テンプレートスロットとしてコンポーネント内（私はAJAX要求から得たことを）入れてHTMLをカントができますか？たぶんいくつかのベストプラクティス？

おかげ

モーダルの本体でレンダリングしたいのですか、またはVueコードを含む可能性がありますか？ – Bert

@BertEvansモーダルウィンドウには、ドロップダウンや入力などのvueコンポーネントを含めることができます。 –

あなたはHTMLコンテンツが属性v-html="modalContent"を持っていることとしたいモーダル要素を作り、あなたはそのモーダルあなたAjaxリクエストを作成し、this.modalContent

に結果のHTMLを保存開きたいあなたVUEコードで

2017-06-17 16:10:43 David

私は考えていたが、それは良い方法ですか？ハードコーディングのようです。 –

そして、どのようにランダムな量のモーダルウィンドウをページに追加できますか？ –

私はそれを解決しました。

"#app"の外側に必要なhtml（AJAXから取得）の外側にモーダルコンポーネントを配置し、そのインスタンスを新しいVMとして開始する必要があります。

と現在のモーダルウィンドウVMと何を破壊することができる

Modal = { show(), hide(), change() ... }

もちろん非表示方法のように、それを管理するためのラッパーを作成します。

その後、私たちは完全に機能的なモーダルウインドウを持ち、他の誰かを助けることを望みます。

2017-06-18 09:38:30

答えて