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. embsysregview 0.26 无法安装的解决方法。

    最近看到一个比较好的 eclipse 插件:embsysregview,于是想装起来用用看.结果安装过程出错,4个 jar 的包下载不下来,并且通过本地安装的方法也不行. 后来终于找到作者的回复,作者 ...

  2. tornado运行提示OSError: [WinError 10048] 通常每个套接字地址(协议/网络地址/端口)只允许使用一次。

    找到占用端口的进程,kill掉 netstat -ano | find $(port) kill: tskill $(PID)

  3. ant 标签详解

    Ant 开发 Ant的构建文件当开始一个新的项目时,首先应该编写Ant构建文件.构建文件定义了构建过程,并被团队开发中每个人使用.Ant构建文件默认命名为build.xml,也可以取其他的名字.只不过 ...

  4. iOS基础知识之排序

    1.字符串比较 - (NSComparisonResult)compare:(NSString *)str; 例如: NSString *str1 = @"zhangsan"; N ...

  5. 2. springboot启动报错:Field userMapper in com.service.UserService required a bean of type 'com.dao.UserMapper' that could not be found.

    报错信息: 2018-06-25 14:26:17.103  WARN 49752 --- [  restartedMain] ationConfigEmbeddedWebApplicationCon ...

  6. Android自定义View学习(四)

    硬件加速 参考:HenCoder Android 自定义 View 1-8 硬件加速 硬件加速能够让绘制变快,主要有三个原因: 本来由 CPU 自己来做的事,分摊给了 GPU 一部分,自然可以提高效率 ...

  7. 20165304 2017-2018-2 《Java程序设计》第3周学习总结

    教材学习总结 类与对象学习总结 1.类:java作为面向对象型语言具有三个特性:①封装性.②继承性.③多态性.java中类是基本要素,类声明的变量叫对象.在类中定义体的函数题叫方法. 2.类与程序的基 ...

  8. Netbeans使用技巧

    Html代码中的图片.JS.CSS等的引用,不再需要手动输入,非常好用! 直接将你要引用的文件用鼠标拖拽到当中.即使图片.JS.CSS与自己的Html不在同一目录下,Netbeans也会自动为你添加引 ...

  9. 机器学习进阶-图像基本处理-视频的读取与处理 1.cv2.VideoCapture(视频的载入) 2.vc.isOpened(载入的视频是否可以打开) 3.vc.read(视频中一张图片的读取) 4.cv2.cvtColor(将图片转换为灰度图)

    1.vc = cv2.VideoCapture('test.mp4') #进行视频的载入 2.vc.isOpened() # 判断载入的视频是否可以打开 3.ret, frame = vc.read( ...

  10. Vue.js学习和第一个实例

    第一个实例效果图: 1.node.js下载,然后安装.下载地址:链接:http://pan.baidu.com/s/1o7TONhS 密码:fosa 2.下载Vue.js.链接:http://pan. ...