1、vue元件中如何引入iframe?
2、vue如何獲取iframe物件以及iframe內的window物件?
3、vue如何向iframe內傳送資訊?
4、iframe內如何向外部vue傳送資訊?
一、vue元件中如何引入iframe?
如上,直接通過新增iframe標籤,src屬性繫結data中的src,第一步引入就完成了
二、vue如何獲取iframe物件以及iframe內的window物件?
在vue中,dom操作比如上jquery的$('#id')的簡單,但是也有方法,就是通過ref
然後就是獲取iframe的window物件,因為只有拿到這個物件才能向iframe中傳值
三、vue如何向iframe內傳送資訊?
通過postmessage,具體關於postmessage是什麼,自己去google,
我的理解postmessage是有點類似於udp協議,就像簡訊,是非同步的,你發資訊過去,但是沒有返回值的,只能內部處理完成以後再通過postmessage向外部傳送乙個訊息,外部監聽message
為了讓postmessage像tcp,為了體驗像同步的和實現多通訊互不干擾,特別制定的message結構如下
}
通過cmd來區別這條message的目的
具體**如下
向iframe傳送資訊
四、iframe內如何向外部vue傳送資訊?
現在通過單擊『向iframe傳送資訊』這個按鈕,從外部vue中已經向iframe中傳送了一條資訊
}
那麼iframe內部如何處理這個資訊?
至此為止,內部的收發資訊和外部的收發資訊都已解決!
下面是完整**:
提交
vue計算屬性簡單講解
計算屬性都以函式的形式寫在 vue 例項內的 computed 選項內,最終返回計算後的結果。乙個計算屬性裡可以完成各種複雜的邏輯,包括運算 函式呼叫等,只要最終返回乙個結 果就可以。例子 lang en charset utf 8 name viewport content width devic...
vue學習起步 了解下
有這麼一句話,vue是漸進式框架。抽取 漸進式框架 和 自底向上增量開發的設計 這兩個概念是什麼?中的解釋 漸進式代表的含義是 主張 主張指使用時的硬性要求 最少。來個對比就知道什麼叫主張最少 比如說,angular,它兩個版本都是強主張的,如果你用它,必須接受以下東西 在生活中含義是為了保證各施工...
4 12 Lvm講解(下)拓展捲組
拓展捲組 檢視下卷組資訊 root evan 01 vgs vg pv lv sn attr vsize vfree centos 1 2 0 wz n 19.00g 0 vg1 2 1 0 wz n 1.99g 1.70g root evan 01 當邏輯卷持續增大,增大到超過捲組大小的時候,我們...