React设置宽度的坑

  我们知道通过ref可以获取DOM元素,通过style属性可以给此DOM元素添加样式。

  但下面两行的赋值是无效的:

this.HomeRootDiv.style.width=window.screen.width
this.HomeRootDiv.style.height=window.screen.height

  因为style中的width、height是有单位的,必须加上px才是有效的赋值。所以要改成下面这样

this.HomeRootDiv.style.width=`${window.screen.width}px`
this.HomeRootDiv.style.height=`${window.screen.height}px`

React设置宽度的坑的更多相关文章

  1. ie下table无法设置宽度的坑,解决方案:在td里面添加div把td宽度撑开即可。

    <td><div style="width:180px"> <a data-b="2" class="btn btn-s ...

  2. SharePoint 2010 设置宽度1024px

    在模板页中找到 s4-workspace,设置class=”s4-nosetwidth“,然后再设置宽度为1024px:如果要居中,设置style=“margin:0 auto” 这样也会有一个问题: ...

  3. 表格单元格td设置宽度无效的解决办法 .

    http://zzstudy.offcn.com/archives/11366 在做table页面时,有时对td设置的宽度是无效的,td的宽度始终有内部的内容撑开,可以设置padding,但直接设置w ...

  4. span设置宽度有效无效问题

    在html中如何设定span的宽度?这看上去是个很简单的问题,似乎用style中的width属性就可以.例如, <!DOCTYPE html PUBLIC "-//W3C//DTD X ...

  5. Select2插件的隐藏、设置宽度

    <select id="selPrinvice" class="Select2 select2-hidden-accessible" style=&quo ...

  6. ueditor 设置高度height. ue.setHeight(400); 设置宽度 width

    1.引入的文件: <script type="text/javascript" src="../../dist/ueditor1_4_3-utf8-php/uedi ...

  7. React中innerHTML的坑

    [React中innerHTML的坑] 通过React Ref机制返回的对象,是一个阉割的DOM对象,并非原始DOM对象.比如,这个阉割版的DOM对象没有innerHTML对象. <button ...

  8. NPOI 创建Excel 设置宽度 样式 颜色对比表

    前两天用NPOI来操作Office软件,在使用的时候有点问题,也有收获,就做个笔记 记录下来,主要做的事数据的导出功能.一些公共的方法,做个笔记. 更多的详细内容可以到NPOI的官方教程去看  htt ...

  9. duilib 修复Text控件无法设置宽度的bug,增加自动加算宽度的属性

    转载请说明原出处,谢谢~~: 今天有朋友反映CTextUI控件无法设置宽度,于是修复了这个bug,顺便给Text控件增加了一个自动计算宽度的属性,描述如下 <Attribute name=&qu ...

随机推荐

  1. Java Swing类 例子代码:将子类继承JFrame 并且接口按键监听ActionLisetener (将内容直接添加到JFrame不创建Contaniner)

    package rom; import java.awt.BorderLayout; import java.awt.Color; import java.awt.Container; import ...

  2. 在linux环境下mongodb的安装和启动

    安装 下载mongodb的版本,两点注意 根据业界规则,偶数为稳定版,如1.6.X,奇数为开发版,如1.7.X 32bit的mongodb最大只能存放2G的数据,64bit就没有限制 到官网,选择合适 ...

  3. JavaScript进行简单的随即验证码生成(适合和我一样刚入门一本完整的教材书都没看完的弟弟)

    (感谢橙旭园给我打开了前端世界的大门) var checkcode = document.getElementById("code"); var btn = document.ge ...

  4. js代码执行过程

    一:first-blood:任何程序执行的第一步总是会先检查有没有语法错误,如果有,则直接抛出语法错误,直接跳出, 二:second-blood:预编译,预编译呢会有四个执行过程,1:创建执行期上下文 ...

  5. 解析main函数的命令行参数

    原创文章,转载请正确注明本文原始URL及作者. 介绍 写C/C++程序,我们常常需要把main函数的参数作为选项来传递.在linux中,解析选项有专门的函数可以用. int getopt(int ar ...

  6. delphi RTTI 三 属性读取与赋值

    delphi RTTI 读取属性 运行期 通过RTTI给属性赋值 http://docwiki.embarcadero.com/CodeExamples/Berlin/en/Event_RTTI_In ...

  7. day08-MySQl创建用户和授权

    权限管理 我们知道我们的最高权限管理者是root用户,它拥有着最高的权限操作.包括select.update.delete.grant等操作.那么一般情况DBA工程师会创建一个用户和密码,让你去连接数 ...

  8. LeetCode 题解 56. Merge Intervals

    题目大意:给出一组区间,合并他们. 首先是排序,首先看start,start小的在前面.start相同的话,end小的在前面. 排序以后,要合并了. 我自己的笨方法,说实在的问题真的很多.提交了好几次 ...

  9. Model操作补充

    参考: http://www.cnblogs.com/wupeiqi/articles/6216618.html

  10. Vue router 的使用--初级

    在说 VueRouter 之前,首先要弄明白vueRouter 是干什么的,有什么用 说出来其实很简单,就是一个模板替换的问题,当路由改变的时候,把和路由相关的模板显示出来,就是这么简单.但是,当我们 ...