记录最近工作中遇到的两个小问题

1.  import xlsx from ‘xlsx’ , console.log(xlsx) 提示undefined

问题出在可能是安装了新版本的xlsx,改为使用  import * as xlsx from 'xlsx' 解决了问题

2. 样式为 display: inline-block 的多个子节点超出宽度会换行,要强制不换行

太久没去写过 display: inlline-block 这种并排布局了,工作现在用到比较多的是flex布局,在flex的布局里很简单,直接使用 flex-wrap: nowrap即可,突然有点忘了怎么处理内联块元素这种问题,通过chatGPT告诉了我答案,在这里记录下来。

要使带有 display: inline-block  样式的多个子节点不换行,您可以将父元素的 white-space  样式属性设置为 nowrap 。这将确保子元素不会自动换行,即使子元素的宽度之和超过父元素的宽度。

样式设置示例:

.parent {

  white-space: nowrap;

}

.child {

  display: inline-block;

}

HTML 结构示例:

<div class="parent">

  <div class="child">子节点 1</div>

  <div class="child">子节点 2</div>

  <div class="child">子节点 3</div>

</div>

在这个示例中,设置了 white-space: nowrap  的父元素中的子元素将不会换行。请注意,当子元素的总宽度超过父元素的宽度时,它们将溢出父元素的边界。您可以通过为父元素添加 overflow  样式控制溢出的显示方式(如:overflow: scroll ,overflow: auto ,overflow: hidden  等)。

说说我的看法