Реагирование на стиль / компонент не отображается (MS Fabric UI) - PullRequest
0 голосов
/ 28 ноября 2018

У меня есть список, который я хочу стилизовать с помощью компонента «Список» реагирующих тканей Microsoft, как показано здесь:

https://developer.microsoft.com/en-us/fabric#/components/list

(один с «Рендерингом элементов-призраков, в то время каксписок "прокручивает" заголовок).

Я пытаюсь следовать примерам и делаю следующее:

 import { List } from 'office-ui-fabric-react/lib/List';
  import { Image, ImageFit } from 'office-ui-fabric-react/lib/Image';


 return (


  <div>


      { listItems.length > 0 && listItems.map((item: Project) => {

        return (


           <div>


        <div  data-is-focusable={true}  className="ms-ListGhostingExample- 
   itemCell">
     <Image 
     className="ms-ListGhostingExample-itemImage"
              src={item.ListUrl.substring(0, item.ListUrl.indexOf("/Lists")) + "/_api/GroupService/GetGroupImage?id" }
              width={50}
              height={50}
              imageFit={ImageFit.cover}

          />  

          <div className="ms-ListGhostingExample-itemContent">
          <div className="ms-ListGhostingExample-itemName"> <a  href={item.ListUrl.substring(0, item.ListUrl.indexOf("/Lists"))}>{item.Title}</a></div>

           </div></div>
           </div>


        );
      })}
      </div>

Хотя я не получаю никаких (синтаксических) ошибок, стили не применяются ввсе.Почему не работает?

1 Ответ

0 голосов
/ 30 ноября 2018

In Визуализация элементов-призраков при прокрутке списка пример по следующей ссылке:

imports import './List.Ghosting.Example.scss';

применяется ожидаемый стильза List компонент.В вашем случае эти стили могут применяться следующим образом:

import 'office-ui-fabric-react/lib/components/List/examples/List.Ghosting.Example.scss';
...