我想爲我的項目在VueJS中實現Modal窗口。 因爲我總是在jQuery的那樣:Vue js和動態組件和內容
- 獲取模式的HTML通過AJAX(HTML是動態的和後端使它)
- HTML代碼附加到BODY
但VueJS有不同的邏輯和我真的不知道如何創建完全動態的模態窗口。
我可以創建模態窗口組件並追加到身體,但我不能把HTML(我從AJAX請求得到)內部的元件作爲模板槽
<slot></slot>.
所以,我該怎麼辦呢?也許有一些最佳實踐?
感謝
我想爲我的項目在VueJS中實現Modal窗口。 因爲我總是在jQuery的那樣:Vue js和動態組件和內容
但VueJS有不同的邏輯和我真的不知道如何創建完全動態的模態窗口。
我可以創建模態窗口組件並追加到身體,但我不能把HTML(我從AJAX請求得到)內部的元件作爲模板槽
<slot></slot>.
所以,我該怎麼辦呢?也許有一些最佳實踐?
感謝
讓你想要的HTML內容是有屬性v-html="modalContent"
和模態元素然後當你想打開模式讓您的Ajax請求,並生成的HTML保存到this.modalContent
我在想但是..那是好方法嗎?看起來像硬編碼。 –
如何添加隨機數量的模態窗口頁面? –
我解決了它。
我們需要將我們的模式組件放在「#app」之外,並在其中需要html(從AJAX獲取它)並將該實例啓動爲新vm。
,打造包裝來管理這樣說,這當然
Modal = { show(), hide(), change() ... }
隱藏位置的方法可以摧毀當前模式窗口VM和什麼。
所以在那之後,我們將有完整的功能模態窗口,希望能幫助別人。
它只是*你想要在模態的主體中呈現的HTML,還是可能包含Vue代碼? – Bert
@BertEvans模態窗口可以包含像下拉菜單,輸入等等vue組件。 –