nuxt.js实战之window和document对象的使用
在开发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对象的使用的更多相关文章
- javascript中window与document对象、setInterval与setTimeout定时器的用法与区别
一.写在前面 本人前端菜鸟一枚,学习前端不久,学习过程中有很多概念.定义在使用时容易混淆,在此给向我一样刚踏入前端之门的童鞋们归纳一下.今天给大家分享一下js中window与document对象.se ...
- Window及document对象的区别
一.Window对象 -------------------------------------------------- ------------------- 对象属性 window //窗户自身 ...
- js基础之DOM中document对象的常用属性方法
-----引入 每个载入浏览器的 HTML 文档都会成为 Document 对象. Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问. 属性 1 document.an ...
- Window及document对象
注:页面上元素name属性以及JavaScript引用的名称必须一致包括大小写 否则会提示你1个错误信息 "引用的元素为空或者不是对象" 一.Window对象 ---------- ...
- nuxt.js实战之引入jquery
head: { title: 'nuxt', meta: [ { charset: 'utf-8' }, { name: 'viewport', content: 'width=device-widt ...
- nuxt.js实战之移动端rem
nuxt.js的项目由于是服务端渲染,通过js动态调整不同尺寸设备的根字体这种rem方案存在一种缺陷.由于设置字体的代码不能做服务端渲染,导致服务端返回的代码一开始没有相应的跟字体,直到与前端代码进行 ...
- nuxt.js实战之用vue-i18n实现多语言
一.实现步骤 1.安装vue-i18n并且创建store.js(vuex状态管理)文件 2.创建一个(middleware)中间件,用来管理不同的语言 3.创建不同语言的json文件作为语言包(例如: ...
- nuxt.js实战踩坑记录
读万卷书不如行万里路,必须实践出真理! 看官方文档安装项目vue init nuxt-community/starter-template <project-name>注意:这是新手项目不 ...
- nuxt.js实战之开发环境配置
一.创建项目 1.使用如下命令生成项目 vue init nuxt-community/starter-template testPro --testPro为项目名称 2.进入到项目根目录下,使用np ...
随机推荐
- DVWA 黑客攻防演练(三)命令行注入(Command Injection)
文章会讨论 DVWA 中低.中.高.不可能级别的命令行注入 这里的需求是在服务器上可以 ping 一下其他的服务器 低级 Hacker 试下输入 192.168.31.130; cat /etc/ap ...
- SpringBoot+Maven多模块项目(创建、依赖、打包可执行jar包部署测试)完整流程
一,创建Maven多模块项目先建立外层父工程 File →new →project 选择Spring Initializr Next下一步到以下页面 工程结构如下 ...
- Windows10系统无法更新
方法一: 1.先检查一下windows update服务是否开启,并禁用杀毒软件: 2.如果此服务已经启动,先尝试更换一下网络环境重新更新: 3.如果更换网络环境后依然无法更新,就删除windows ...
- linq 左连接后实现与主表一对一关系数据
var query1 = from r in _residentRepository.GetAll() join i in _inLogRepository.GetAll() on r.Id equa ...
- 《生命》第五集:Birds (鸟类)
看了前四集之后意犹未尽,今天终于有时间来看第五集了. 本集讲的是鸟类,一个在恐龙开始繁荣的时代才开始有的物种. 鸟类和其他动物最不同的地方,就是羽毛,能隔热,保暖,最重要的是:能帮助他们飞行. 在秘鲁 ...
- Django--用户认证组件auth(登录用-依赖session,其他用)
一.用户认证组件auth介绍 二.auth_user表添加用户信息 三.auth使用示例 四.auth封装的认证装饰器 一.用户认证组件auth介绍 解决的问题: 之前是把is_login=True放 ...
- RESTful API规范
1. 域名 应该尽量将API部署在专用的域名下. https://api.example.com 如果确定API简单,不会有进一步的括在,可以考虑放在主域名之下. https://example.or ...
- Javascript DOM(2)
一.value属性操作 1.具有value属性的三个标签:input.select.textarea 2.value的获取:ele.value input=document.getElementByI ...
- 日志学习系列(一)——Log4net的基础知识学习
今天把Log4net日志记录做了封装,作为一个公共的类库.记录一下应该注意的地方.先了解一下log4net的理论知识. 参考百度百科 一.log4net是什么? log4net库是Apache log ...
- Python总结(一)
从大学开始,就对python有了兴趣,毕业设计就是用python做的一个新闻爬取和关键字提取的程序.然而,毕业之后由于一直没有从事python相关的开发,所以就一直没有再使用,一直停留在偶尔看一些资料 ...