在开发nuxt项目的时候,我们难免会使用到document来获取dom元素。如果直接在文件中使用就会报错。这是因为document是浏览器端的东西服务端并没有。

解决方法:

我们只需要在使用的地方通过process.browser/process.server来判断

如下:

if (process.browser) {
let myVideo = document.getElementById('mini_video');
if (myVideo) {
if (!this.videoShow) {
myVideo.pause();
} else {
myVideo.play();
}
}
}

nuxt.js实战之window和document对象的使用的更多相关文章

  1. javascript中window与document对象、setInterval与setTimeout定时器的用法与区别

    一.写在前面 本人前端菜鸟一枚,学习前端不久,学习过程中有很多概念.定义在使用时容易混淆,在此给向我一样刚踏入前端之门的童鞋们归纳一下.今天给大家分享一下js中window与document对象.se ...

  2. Window及document对象的区别

    一.Window对象 -------------------------------------------------- ------------------- 对象属性 window //窗户自身 ...

  3. js基础之DOM中document对象的常用属性方法

    -----引入 每个载入浏览器的 HTML 文档都会成为 Document 对象. Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问. 属性 1  document.an ...

  4. Window及document对象

    注:页面上元素name属性以及JavaScript引用的名称必须一致包括大小写 否则会提示你1个错误信息 "引用的元素为空或者不是对象" 一.Window对象 ---------- ...

  5. nuxt.js实战之引入jquery

    head: { title: 'nuxt', meta: [ { charset: 'utf-8' }, { name: 'viewport', content: 'width=device-widt ...

  6. nuxt.js实战之移动端rem

    nuxt.js的项目由于是服务端渲染,通过js动态调整不同尺寸设备的根字体这种rem方案存在一种缺陷.由于设置字体的代码不能做服务端渲染,导致服务端返回的代码一开始没有相应的跟字体,直到与前端代码进行 ...

  7. nuxt.js实战之用vue-i18n实现多语言

    一.实现步骤 1.安装vue-i18n并且创建store.js(vuex状态管理)文件 2.创建一个(middleware)中间件,用来管理不同的语言 3.创建不同语言的json文件作为语言包(例如: ...

  8. nuxt.js实战踩坑记录

    读万卷书不如行万里路,必须实践出真理! 看官方文档安装项目vue init nuxt-community/starter-template <project-name>注意:这是新手项目不 ...

  9. nuxt.js实战之开发环境配置

    一.创建项目 1.使用如下命令生成项目 vue init nuxt-community/starter-template testPro --testPro为项目名称 2.进入到项目根目录下,使用np ...

随机推荐

  1. SqlServer sa 用户登录失败的解决方法

    一.控制面板->服务->MS SQL SERVER->登录-->本地系统帐户-->重新启动MS SQL SERVER用windows验证登陆查询分析器-->执行 s ...

  2. Linux命令学习总结:ls

    命令简介: ls命令用来列出目标目录(缺省的话为当前目录)中所有的子目录和文件.指令英文原义:list 指令所在路径:/bin/ls 执行权限:All User 命令语法: ls [OPTION].. ...

  3. Github速度慢的解决方法

    首先ping一下github.global.ssl.fastly.net 得到相应的ip,例如我现在ping的ip是151.101.41.194 151.101.41.194 github.globa ...

  4. sqlserver数据库触发器调用外部exe

    sqlserver数据库触发器调用外部exe,同事可以选择参入参数! sqlserver使用 master..xp_cmdshell 进行外部exe的执行. 使用master..xp_cmdshell ...

  5. 关于 pyspider Web预览界面太小的解决方法

    本人最近在学习pyspider时,遇到Web预览界面太小而无法很好的进行开发,于是在网上搜索解决方法. 准备: css代码: body{margin:;padding:;height:%;overfl ...

  6. SystemTap Beginners Guide

    SystemTap 3.0 SystemTap Beginners Guide Introduction to SystemTap Edition 3.0   Red Hat, Inc. Don Do ...

  7. python接口自动化-get请求

    一.环境安装 1.用pip安装requests模块 >>pip install requests 二.get请求 1.  url 1.1:   response 的返回内容还有很多信息,例 ...

  8. MySQL常用日期时间函数

    日期和时间函数: MySQL服务器中的三种时区设置: ①系统时区---保存在系统变量system_time_zone ②服务器时区---保存在全局系统变量global.time_zone ③每个客户端 ...

  9. Editplus5.0 注册码

    EditPlus5.0注册码 注册名 Vovan 注册码 3AG46-JJ48E-CEACC-8E6EW-ECUAW EditPlus3.x注册码 注册名 linzhihui 注册码 5A2B6-69 ...

  10. 第五章:Realm

    一,UserRealm 1,UserRealm父类AuthorizingRealm将获取Subject相关信息分成两步: 1.1,获取身份验证信息(doGetAuthenticationInfo): ...