#*************************====更新 2020-07-27 start***************===
監聽頁面大小變化，可以在main.js檔案中使用window.addeventlistener方法進行監聽處理。
例如：監聽頁面大小變化，進行字型處理
function onresize()let bodywidth = document.body.getboundingclientrect().width;
let resultfontsize = bodywidth / designbodywidth * htmlbasefontsize;
let html = document.getelementsbytagname('html')[0];
html.style.fontsize = resultfontsize + 'px';
}window.addeventlistener('resize', onresize);
onresize();
#*************************====更新 2020-07-27 end***************===
目中由於某些div元素在布局的時候需要初始化寬高，因為當瀏覽器縮小螢幕的時候需要重新重新整理頁面檢視。
分析思路：
1、在store中建立state，用於儲存當前瀏覽器的寬、高值。
2、在mounted中，使用window.onresize，監聽頁面大小是否發生變化。若發生變化則，則this.$store.commit修改store中的的寬、高；
3、在computed中獲取到寬高的值。由於頁面寬或者高其中乙個變化都需要重新進行頁面檢視重新整理，因此在computed中進行寬高合併，只需要監聽合併後的值widthorhight既可。
4、在watch中監聽widthorhight，若widthorhight發生變化，則重新初始化div的寬高。
另外，由於子元件中圖表初始化的寬高是父元件的寬高，在父元件中頁面檢視重新發生了變化，需要子元件重新渲染檢視，因此只需要給子元件定義乙個key值，然後修改key值則子元件會重新初始化。
1<
template
>
2<
div>34
<
videodoorctrl
style
="height: 90%;width: 100%;background-color: rgba(2, 31, 95, 0.3);"
:key
="compkey.videodoorctrl"
>
videodoorctrl
>
5<
wificollect
style
="height: 90%;width: 100%;background-color: rgba(2, 31, 95, 0.3);"
:key
="compkey.wificollect"
>
wificollect
>
6div
>
7template
>89
<
script
>
10import from
'vuex';
11import videodoorctrl from
'./components/videodoorctrl';
//12
import wificollect from
'./components/wificollect';
//wifi資料採集
1314
export
default,20
21data() ,27}
28},
29mounted() )()35}
36},
37computed:
42},
43watch: ,
400)52}
53},
54computed: {},
55beforecreate() {},
56created() {},
57methods: ,
61initpage() ,74}
75}76script
>
7778
<
style
rel="stylesheet/scss"
lang
="scss"
scoped
>
7980
style
>
vue 監聽windows視窗大小變化
data mounted that.timer false 400 只需要監聽視窗大小，上面的 已經夠了，然後是echart大小改變的乙個細節，我是每個echart圖表都是乙個元件，乙個父元件有多個echart子元件，如下 開始我在每個子元件都寫了乙個上面的方法，但是發現頁面只有乙個圖示會隨著瀏覽器...
Android 監聽網路變化然後重新整理頁面
1.先在androidmanifest.xml中新增有關的許可權,以及receiver的intent filter android.permission.access network state true android exported true android name receiver.glo...
vue監聽陣列變化
1 觸發更新檢視 2function updateview 56 重新定義陣列原型 7 const oldarrayproperty array.prototype8 建立新物件，原型指向 oldarrayproperty 再擴充套件新的方法不會影響原型 9 const arrproto objec...