react 动态修改 document.title
装饰器
// withComponents/withHeaderBar.js
import React, { Component } from "react";
import HeaderBar from "../components/headerAppBar";
const l = console.log;
const styles = {
root: {
marginTop: "3rem",
},
};
export default function withHeaderBar({
title,
children,
position,
component = true,
}) {
return function(Target) {
return class WithHeaderBar extends Component {
componentWillMount() {
// document.title = title;
setTitle(title);
}
render() {
const style = position === "fixed" ? styles.root : {};
return component ? (
<div style={{ ...style }}>
<HeaderBar title={title} children={children} position={position} />
<Target {...this.props} />
</div>
) : (
<Target {...this.props} />
);
}
};
};
}
function setTitle(t) {
document.title = t;
var iframe = document.createElement("iframe");
iframe.style.visibility = "hidden";
iframe.setAttribute("src", "favicon.ico");
var iframeCallback = function() {
setTimeout(function() {
iframe.removeEventListener("load", iframeCallback);
document.body.removeChild(iframe);
}, 0);
};
iframe.addEventListener("load", iframeCallback);
document.body.appendChild(iframe);
}
使用
@withHeaderBar({
title: "附近优惠",
position: "fixed",
})
class NearbyOffers extends Component {
render() { ... }
}
react 动态修改 document.title的更多相关文章
- hack在微信等webview中无法修改document.title的情况
var $body = $('body'); document.title = '确认车牌'; // hack在微信等webview中无法修改document.title的情况 var $iframe ...
- 微信等webview中无法修改document.title的情况
// hack在微信等webview中无法修改document.title的情况 var $iframe = $('<iframe src="https://www.bbtree.co ...
- 基于Vue的SPA动态修改页面title的方法
最近基于VUE做个SPA手机端web发现动态修改页面标题通过document.title=xxxx 来修改着实蛋疼,而且在IOS的微信端据说没效果.百度发现要针对IOS的微信做点额外的操作,即:创建一 ...
- js动态修改浏览器title
script标签依据浏览框的失焦获焦进行函数操作(操作简单放到HTML文件下的head标签下就可以) <script> window.onfocus = function () { doc ...
- ng 设置动态的document title
使用Title服务 相关文章 配置路由, 添加data.title参数 import { NgModule } from '@angular/core'; import { RouterModule, ...
- easyui 动态修改窗口title
http://blog.csdn.net/liu251890347/article/details/39292307?utm_source=tuicool 使用easyui作为前台框架极大的节省了项目 ...
- 用document.title=“xxx”动态修改title,在ios的微信下面不生效的解决办法!
//需要jQuery var $body = $('body'); document.title = 'title'; // hack在微信等webview中无法修改document.title的情况 ...
- 用document.title=“xxx”动态修改title,在ios的微信下面不生效
单页应用里整个页面只会在第一次完全刷新,后面只会局部刷新(一般不包括head及里面的title),所以无法在服务器端控制title,只能在页面刷新的时候通过js修改title.常规做法如下,可惜在iO ...
- JS动态修改微信浏览器中的title
JS动态修改微信浏览器中的title我们的原理是设置一个ifame然后我们再加载一下就可以实现了,具体的例子如下所示. 平时使用JS修改title,直接document.title=新标题就好了 这样 ...
随机推荐
- .NET语言的编译过程:中间语言(IL)和即时编译器(JIT)
.NET语言的编译分为两个阶段.首先高级语言被编译成一种称作IL的中间语言,与高级语言相比,IL更像是机器语言,然而,IL却包含一些抽象概念(比如:类.异常),这也是这种语言被称为中间语言的原因.IL ...
- Deepin 15.4 挂载分区
硬盘是 500G,先前安装 Windows7 时,分了3个区,大小分别为 90G.100G.310G,现在用 Deepin 重装系统时,挂载情况如下: /dev/sda1 分区作为 /(挂载点),类型 ...
- C10K问题
转自:https://www.jianshu.com/p/ba7fa25d3590 C10K问题由来 随着互联网的普及,应用的用户群体几何倍增长,此时服务器性能问题就出现.最初的服务器是基于进程/线程 ...
- beego orm 忽略字段
忽略字段 设置 - 即可忽略 struct 中的字段 type User struct { ... AnyField string `orm:"-"` ... } beego or ...
- golang 特殊知识点
golang 代码不需要分号; 但是又会自己在底层增加;号 ,所以 golang的{左花括号必须在代码的最后一行,而不能在新的一行; golang 代码组织里需要注意 vendor 和 interna ...
- Centos7中离线安装DockerCE最新版
一.简述 离线在Centos7中部署DockerCE. 二.步骤 (1)在有外网的计算A上执行: 1.配置安装源存放路径 mkdir -p /root/docker-ce-local &&am ...
- SpringBoot乱码
第一步: 第一步,约定好传参编码格式 不管是运用httpclient,还是原生http,都要设置传参的编码,为了统一,这儿全部设置为utf-8 第二步,修正application.properties ...
- [转]PID控制算法原理
PID控制算法是工业界使用极其广泛的一个负反馈算法,相信这个算法在做系统软件时也有用武之处,这里摘录了知乎上的一篇文章,后面学习更多后自己总结一篇 以下为原文: PID控制应该算是应用非常广泛的控制算 ...
- WINDOWS API ——GETFILETIME——获取文件时间
GetSystemTime(LPSYSTEMTIME lpSystemTime)得到系统时间,这个时间是标准的UTC时间,也就是没有包含任何时区的时间的GetLocalTime(LPSYSTEMTIM ...
- Nodejs 使用 es module (import/export)