vue listens for changes in the window to re-render some elements of the page

question

The usual practice when handling page re-rendering is:

Use vue-router to rerout to the current page, the page will not be refreshed

When refreshing with () or (0), the entire browser is reloaded and flashes, and the experience is not good.

Rerender some components or containers using v-if

Content that needs to be rerendered

<div v-if="render">
 ...
</div>

vue listening window size changes

Use () to add resize event listening window changes

new Vue({
 el: '#app',
 data() {
  return { render: true }
 },
 mounted() {
  ('resize', )
 },
 beforeDestroy() {
  ('resize', )
 },
 methods: {
  reload() {
   // Re-render    = false
   this.$nextTick(() => {
     = true
   })
  }
 }
})

Supplementary knowledge:vue has the same route, but the parameters change and the page does not refresh (vue listens for changes in route parameters and re-renders the page)

I won't say much nonsense, let's just read the code~

watch: {
 $route: function(newVal, oldVal) {
  (oldVal); //oldVa last url  (newVal); //newVal This time the url  if (newVal != oldVal) {
   ();//Recall load function  }
 }
}

The above article vue monitoring window changes re-rendering operation on some elements of the page is all the content I share with you. I hope you can give you a reference and I hope you can support me more.