React设置宽度的坑

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`
时间: 2024-08-08 13:54:50

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

初用react容易踩的坑

此文章同步连接: https://github.com/p2227/p2227.github.io/issues/3 # 初用react容易踩的坑 ## 自定义组件忘记大写第一个字母 ```javascript var myComp = React.createClass({ render: function() { return <div>Hello world</div>; } }); ReactDOM.render(<myComp />, mountNode);

进行手持设备wince开发中DataGrid的样式设置(宽度)

private void SelectGoodsForm_Load(object sender, EventArgs e) { //定义 DataGrid样式 DataGridTableStyle dataGridStyle = null; dataGridStyle = new DataGridTableStyle(); this.goodsGrid.DataSource = createDataTable(); //清楚之前的DataGrid样式 this.goodsGrid.TableSt

不设置宽度的盒子模型水平居中问题。

经常会遇到这个问题:在最外层盒子模型不方便设置宽度的情况下,缩小放大窗口时,希望盒子模型也能继续水平居中.特别是在做移动端页面的时候,如果给外层盒子模型设置宽高,会多出很多代码. 例子: 图中(三个固定宽高的黄色背景盒子)被(不固定宽高的红色背景盒子box)所包裹.div标签另有作用,后面会讲到. 1 <div> 2 <ul id="box"> 3 <li>1</li> 4 <li>2</li> 5 <li&

SharePoint 2010 设置宽度1024px

SharePoint 2010 设置宽度1024px 在模板页中找到 s4-workspace,设置class=”s4-nosetwidth“,然后再设置宽度为1024px:如果要居中,设置style=“margin:0 auto” 这样也会有一个问题:滚动条的问题.这样那个滚动条就会在中间. 可以这样:设置s4-workspace的overflow:visible ; 这样设置完之后应该是没有问题了,但是,就怕但是,页面就没有滚动条了,超出屏幕的范围就看不到了. 可以这样:设置body的样式,

&lt;span&gt; 无法设置宽度的完美解决方案!

在默认的情况下,利用css样式对span进行宽度设定是无效,但有时为了某种排版的要求,需要对span进行宽度设定,那么如何在html中利用css样式设定span的宽度? 思路:这看上去是个很简单的问题,似乎用style中的width属性就可以. 然而通过试验以后发现,无论是在Firefox还是IE中都无效. 在css2的标准中,查阅关于width的定义,我们可以发现,原来css中的width属性并不总是有效的,如果对象是inline对象,width属性就会被忽略.Firefox和IE都遵循了这个

如何给超链接设置宽度和高度

1.利用display:block属性 1: <!DOCTYPE html> 2: <html> 3: <head> 4: <meta charset="utf-8" /> 5: <title>a设置宽度和高度</title> 6: <style> 7: .abc a{ 8: display:block; 9: width:130px; 10: height:30px; 11: border:1px s

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

前两天用NPOI来操作Office软件,在使用的时候有点问题,也有收获,就做个笔记 记录下来,主要做的事数据的导出功能.一些公共的方法,做个笔记. 更多的详细内容可以到NPOI的官方教程去看  http://tonyqus.sinaapp.com/ 1.引用NPOI 这个,使用第三方类库就要添加DLL ,我使用的是1.2.5的版本 ,具体的版本可以在属相中找到 如下图. 貌似最新的版本到了2.0了 DLL文件点击下载 2.创建简单的一个Excel MemoryStream ms = new Me

怎样给超链接设置宽度和高度

1.利用display:block属性 1: <!DOCTYPE html> 2: <html> 3: <head> 4: <meta charset="utf-8" /> 5: <title>a设置宽度和高度</title> 6: <style> 7: .abc a{ 8: display:block; 9: width:130px; 10: height:30px; 11: border:1px s

span设置宽度有效无效问题

在html中如何设定span的宽度?这看上去是个很简单的问题,似乎用style中的width属性就可以.例如, 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 2 3 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 4 5 <html xmlns="http://www.w3.org/19