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. js常用内置对象

    数组Array 1创建方式 var colors = ['red','color','yellow']; var colors2 = new Array(); 2数组的赋值 var arr = []; ...

  2. 使用Java让android手机自动执行重复重启

    public static void main(String[] args)throws IOException,Exception { for(int j=0;j<10;j++) { Thre ...

  3. uva-317-找规律

    无耻的抄袭了结果,三组数,从每一组数中选取一个数组成正六边形的对边,总共会有27个正六边形,从27个小六边形中选取19个组成大六边形,求大六边形的最大值 #include<iostream> ...

  4. 18.Mysql搜索引擎及其区别

    这是面试中的问题:当时也是没有直接回答出来,还是因为基础知识不扎实. 一般Mysql常用的搜索引擎有:ISAM.MylSAM.HEAP.InnoDB.Berkley(BDB) ISAM:执行读取操作的 ...

  5. 12.通过微信小程序端访问企查查(采集工商信息)

    需要注意的问题: 一.1.微信端访问企查查小程序需要登录.2.访问抓包获取的url是有时效性的过一段时间就不能用了. http://xcx.qichacha.com/wxa/v1/base/getEn ...

  6. nodeJs 资料

    http://blog.csdn.net/binyao02123202/article/details/18811207 非常详细 http://www.runoob.com/nodejs/nodej ...

  7. ubuntu 系统分区

    参考:https://blog.csdn.net/kudou1994/article/details/80913059

  8. JS获取QueryString(Jquery)

    QueryString = {      data: {},      Initial: function() {          var aPairs, aTmp;          var qu ...

  9. STM32之USB电路(摘要笔记)

  10. beego生成 api 项目 && api 文档

    目标 生成 api 项目,并且自动生成db的mapper.module等:同时生成api文档 操作步骤 1.生成 api 项目,并且自动生成db全表的映射 bee api [projectName] ...