Как получить текущую тему в веб-части spfx, используя новый подход к стилю на основе ts - PullRequest
Новая
       46

Как получить текущую тему в веб-части spfx, используя новый подход к стилю на основе ts

0 голосов
/ 19 февраля 2019

Мы разрабатываем современные веб-части для сайтов связи O365 с использованием Office UI Fabric React.Я хочу использовать новый подход на основе ts для стилизации моих компонентов (см. Здесь) .Все работает довольно хорошо, за исключением того, что в нем не используется текущая тема сайта SharePoint, на котором он развернут.

Моя веб-часть была создана с использованием стандартных лесов Yeoman для веб-частей SharePoint (выбрав React в качестве платформы).

Мой код стиля выглядит следующим образом: 

import { getTheme, FontWeights, mergeStyleSets } from 'office-ui-fabric-react/lib/Styling';

export interface IComponentClassNames {
    locationBanner: string;
    locationLabel: string;
    locationValue: string;
    editLocationButton: string;
    findLocationButton: string;
}

const theme = getTheme();

export const getClassNames = (): IComponentClassNames => {
    return mergeStyleSets({
        locationBanner: {
            display: 'inline-flex',
            paddingLeft: '8px',
        },
        locationLabel: [
            theme.fonts.large,
            {
                color: theme.palette.neutralPrimary
            }
        ],
        locationValue: {
            color: theme.palette.themeDark
        },
        editLocationButton: {
            paddingLeft: '20px'
        },
        findLocationButton: {
            paddingLeft: '10px'
        }
    });
};

И затем в части рендеринга моего компонента я делаю следующее: 

const {locationBanner, editLocationButton, findLocationButton, locationLabel, locationValue} = getClassNames();

И затем применяю это в атрибутах className-attribute,Это работает нормально, и стиль применяется - однако: getTheme() возвращает тему по умолчанию (т.е. в основном синюю), а не ту, которая в настоящее время установлена ​​на сайте SharePoint.Должен ли я каким-то образом передать тему моему компоненту (из веб-части) или как это должно работать?

1 Ответ

0 голосов
/ 12 мая 2019

Мне кажется, что вы используете библиотеку office-ui-fabric-реагировать.Импортируемый вами метод getTheme приходит оттуда.Я не вижу, как office-ui-fabric-реагирует на запросы SharePoint для текущей темы.Это может быть отслеживание самостоятельно.Я бы попробовал получить тему через библиотеки компонентов SharePoint.https://docs.microsoft.com/en-us/javascript/api/sp-component-base/themeprovider

...