如何在 Typescript 中为字符串添加换行符？答案

【问题标题】：How to add line break to a string in Typescipt?如何在 Typescript 中为字符串添加换行符？
【发布时间】：2021-06-14 23:17:46
【问题描述】：

我有一组显示月份的按钮，但它们都显示在一行/行上，我想在 6 月底设置中断，因此它显示在两行上。我该怎么做？我试过June' + '\n' 并没有用，<br> 也没有用。更新了更多代码，包括来自 Vue 文件和 css 的代码。

Vue

    <common-subsection
        id="monthsSelected"
        headerTitle="Months">
        <common-forminputs-checkboxeswithvalidation
            rules="required|min:1"
            name="months"
            id="months"
            vid="months"
            :options="monthNames"
            v-model="months"
            buttons
            button-variant="primary"
            requiredDisplayName="Months"
        />
    </common-subsection>

打字稿

      months = [];
      monthNames = [
      'January',
      'February',
      'March',
      'April',
      'May',
      'June',
      'July',
      'August',
      'September',
      'October',
      'November',
      'December',        
   ];

CSS

#months label.btn{
 margin: 0 0.25em 0 0;
 border: 1px solid #D0D0D0;
 overflow: auto;
 float: left;
 height: 43px;
 width: auto;
 padding:0;
 background-color: #fff;
 color:#656565;
 min-width:150px;

  span{
   text-align: center;
   padding: 1em;
   display: block;
   height: 100%;
   text-transform: capitalize;
   }

 &:hover{
    background: var(--secondary);
    color: #fff;
    cursor: pointer;
    }

  &.active{
  background-color: #2e81ab;
  color: #fff;
  }

}

更新的代码是这样的吗？如果是这样，那似乎不起作用。

<common-subsection
   id="monthsSelected"
   headerTitle="Months"
   style="display: grid; grid-template-columns: repeat(6, 1fr);">
   <common-forminputs-checkboxeswithvalidation
    rules="required|min:1"
    name="months"
    id="months"
    vid="months"
    :options="monthNames"
    v-model="months"
    buttons
    button-variant="primary"
    requiredDisplayName="Months"
 />

【问题讨论】：

请展示组件的模板，尤其是渲染月份和样式的部分。

标签： css typescript vue.js

【解决方案1】：

用这种样式包裹标签内的所有按钮：

display: grid;
grid-template-columns: repeat(6, 1fr);

【讨论】：

不。我不知道 vue，但我认为月份在 common-forminputs-checkboxeswithvalidation 内，所以这是应该包含这些样式的组件。