Shulou(Shulou.com)05/31 Report--

This article introduces the knowledge of "how to monitor the window height of vue". In the operation of actual cases, many people will encounter such a dilemma, so let the editor lead you to learn how to deal with these situations. I hope you can read it carefully and be able to achieve something!

The specific steps are as follows:

1. First, create a new html project and introduce vue into the project

Import Vue from 'vue'

two。 After introducing vue, define a data value in the project to record the window height

Data () {

Return {

ClientHeight:''

}

}

After the 3.data value is defined, use the _ window.onresize method to get the window height

Mounted () {

This.clientHeight = `${document.documentElement.clientHeight}`

Let that = this

_ window.onresize = function () {

This.clientHeight = `${document.documentElement.clientHeight}`

If (that.$refs.page) {

That.$refs.page.style.minHeight = clientHeight-100 + 'px'

}

}

}

4. Finally, after the window height is obtained, the window height can be monitored in real time by using the watch method.

Watch: {

ClientHeight () {

This.changeFixed (this.clientHeight)

}

}

This is the end of the content of "how vue monitors window height". Thank you for reading. If you want to know more about the industry, you can follow the website, the editor will output more high-quality practical articles for you!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.