კომპოზიციების ბრძანება CSS მოდულების ფაილებში React-ში

ბრძანება composes ასევე შეიძლება გამოყენებულ იქნას ერთი ფაილიდან სტილების ხელახლა გამოყენებისთვის მეორეში.

დავუბრუნდეთ აპლიკაციას buttons, რომელსაც წინა გაკვეთილებში ვქმნიდით. დავუშვათ, ჩვენ გვსურს ყველა ღილაკს დავუმატოთ იგივე ჩრდილები, კურსორის სტილი და მსხვილი ფონტი. ეს სტილები მოდით იყოს განთავსებული ფაილში App.module.css. მოდით გავხსნათ ეს ფაილი და დავამატოთ დასაწყისში ახალი კლასი beauty ამ სტილებით:

App.module.css.beauty { 
  box-shadow: rgba(50, 50, 50, 0.2) 0 5px 5px 0;
  font-weight: bold;
  cursor: pointer;
}

მოდით გამოვიყენოთ იგი ღილაკების სტილიზაციისთვის. ამისთვის გავხსნათ Buttons.module.css და შევიტანოთ ცვლილებები კლასში common-btn. ჩვენ დავამატებთ სტრიქონს ბრძანებით composes, სადაც მივუთითებთ კლასის სახელს beauty, რომლის გამოყენებაც გვსურს და ფაილის App.module.css, რომელშიც მდებარეობს ეს კლასი:

Buttons.module.css.common-btn {
  composes: beauty from "../App.module.css"; 
  font-size: 16px;
  border-radius: 3px;
}