如何解决使用Vue全屏软件包时this$ refs.fullscreen.toggle不是功能错误
大家好,我得到了错误 this。$ refs.fullscreen.toggle不是功能 当我尝试在我的项目中实现vue-fullscreen时。 这是我的代码。
<template>
<div id="app">
<fullscreen ref="fullscreen" @change="fullscreenChange">
Content
</fullscreen>
<button type="button" @click="toggle" >Fullscreen</button>
</div>
</template>
<script>
import fullscreen from 'vue-fullscreen'
import Vue from 'vue'
Vue.use(fullscreen)
export default {
methods: {
toggle () {
this.$refs['fullscreen'].toggle()
},fullscreenChange (fullscreen) {
this.fullscreen = fullscreen
}
},data() {
return {
fullscreen: false
}
}
}
</script>
解决方法
最后这项工作对我来说
document.querySelector("#toFull").addEventListener("fullscreenchange",function (event) {
if (document.fullscreenElement) {
document.querySelector("#exitFullScreen").style.display = "block";
} else {
document.querySelector("#exitFullScreen").style.display = "none";
}
});
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。