vue-fullcalendar - cssクラスと改行が機能しない

Question

ここで誰もWanderxxによって作成されたvue-fullcalendarコンポーネントを使用していますか？

私は2つのことに問題を抱えている：

（1）CSSクラス適用されない【解決しよう】

I各EVENTDATAこの計算機能を持つオブジェクト移入：

eventsArr: function(){ 
 
     let newArr = []; 
 
     let arrEvents = this.transactions; 
 
     for (let x in arrEvents){ 
 
      let eventData = new Object(); 
 
      if(arrEvents[x].Status == "Reserved"){ 
 
      let title = arrEvents[x].Product_name + " \n " + arrEvents[x].userData.Account_name; 
 
      eventData.title = title; 
 
      eventData.start = arrEvents[x].dateValid; 
 
      eventData.end = arrEvents[x].dateValid; 
 
      eventData.cssClass = 'RTW'; 
 
      newArr.push(eventData); 
 
      } 
 
      else if(arrEvents[x].Status == "Accepted"){ 
 
      let title = arrEvents[x].Product_Type + " \n " + arrEvents[x].userData.Account_name; 
 
      eventData.title = title; 
 
      eventData.start = arrEvents[x].dateFinish; 
 
      eventData.end = arrEvents[x].datefinish; 
 
      eventData.cssClass = 'mto'; 
 
      newArr.push(eventData); 
 
      } 
 
     } 
 
     return newArr; 
 
    }

小道具このようなCSSのセクションで宣言されたクラスmtoです：

.mto{ 
 
    color: white; 
 
    background-color: orange; 
 
}

イベントは白のフォントとオレンジ色の背景に表示されます。しかし、適用されず、スタイルはデフォルトと同じままです（RTW cssClassの場合と同じ）。私がページを調べると、mtoクラスがタグに存在するので、どこが間違っていたのか分かりません。小道具の

（2）作業新しい改行ではない

1はtitleあり、それを保存する前に、私が作っ変数最初とこのようにそれを格納します。

let title = arrEvents[x].Product_Type + " \n " + arrEvents[x].userData.Account_name; 
 
eventData.title = title;

私の目標は、タイトルを2行で表示することでした。しかし、それは動作しませんし、それはまだこのようlooke：

私はそれが見えるようにしたくないと私は完全な名前を表示させたいです。どうすれば2ライナーにすることができますか？

Answer 1

私は、モジュール作業のためにデモをすることはできませんが、CSSのイベント要素はellipsisにプロパティtext-oveflowを設定しています

.full-calendar-body .dates .dates-events .events-week .events-day .event-box .event-item { 
    ... 
    white-space: nowrap; 
    overflow: hidden; 
    text-overflow: ellipsis; 
} 

あなたはそれを上書きする必要があるとしています。
また、2つ（またはそれ以上）の行にテキストを流したい場合は、空白のプロパティも上書きします。