Встроенная обработка тем Devextreme в реагирующем приложении игнорируется ⇐ CSS
-
Anonymous
Встроенная обработка тем Devextreme в реагирующем приложении игнорируется
Я пытаюсь понять, как настраивать темы, поставляемые с devextreme. Я пробовал много разных вещей, но ничего не работает. Я использую Devextreme 23.1.3. Я использую встроенные темы dx. Я использую платформу приложений devextreme с реакцией. У меня есть простая страница, которую я тестирую, на которой есть сетка данных, которая не импортирует файлы scss или css. В index.html у меня есть тег ссылки со следующим синтаксисом
Я запустил его в Chrome и проверил вкладку «Сеть». Я увидел, что вышеуказанные таблицы стилей загружаются:
https://cdn3.devexpress.com/jslib/23.1. ... rkmoon.css https://fonts.googleapis.com/css?family ... 00,500,700 https://fonts.googleapis.com/earlyacces ... arabic.css Сайт нигде не менялся на тему Новолуния.
Простая страница выглядит так.
import React, { useState, useEffect, useRef } из 'реагировать'; импортировать DataGrid, {HeaderFilter, Editing, Paging, Pager, FilterRow, SearchPanel, StateStoring, Column, Scrolling } из «devextreme-react/data-grid»; импортировать {stringify} из "сглаженного"; //импортируем 'devextreme/dist/css/dx.light.css'; //импорт './meters.scss'; const MetersPage = () => { const [данные, setData] = useState([]); // Управляем состоянием данных const [filterValues, setFilterValues] = useState(""); const dataGridRef = useRef (нуль); /* const applyFilter = () => { пусть значения = filterValues.replace(/\s+/g, "").split(','); если (dataGridRef.current) { dataGridRef.current.instance.columnOption("EXTNL_MTR_ID", "filterValues", значения); } }; const ClearFilter = () => { setFilterValues(""); // Очистка значений фильтра если (dataGridRef.current) { dataGridRef.current.instance.columnOption("EXTNL_MTR_ID", "filterValues", null); } }; */ const fetchData = () => { // Выполняем вызов API для получения данных из серверной части Django выборка('https://vm-devmdms02/meters2/') .then((ответ) => ответ.json()) .then((данные) => setData(данные)) .catch((ошибка) => { console.error(ошибка); }); }; const handleSave = (изменения: любые) => { // Клонируем объект изменений, чтобы избежать изменения исходного объекта const clonedChanges = {...изменения}; // Удалить свойства с циклическими ссылками const сериализованные данные = stringify (clonedChanges); // Выполняем вызов API, чтобы сохранить измененные изменения в бэкэнде Django fetch('https://vm-devmdms02/meters2/', { метод: 'POST', тело: сериализованные данные, заголовки: { «Тип контента»: «приложение/json», }, }) .then((ответ) => ответ.json()) .then(() => { // В случае успеха извлекаем обновленные данные и обновляем сетку выборка данных(); }); }; useEffect(() => { выборка данных(); // Получаем данные о монтировании компонента }, []); возвращаться ( ); }; экспортировать MetersPage по умолчанию; Может кто-нибудь сказать мне, что я делаю не так?
Я пытаюсь понять, как настраивать темы, поставляемые с devextreme. Я пробовал много разных вещей, но ничего не работает. Я использую Devextreme 23.1.3. Я использую встроенные темы dx. Я использую платформу приложений devextreme с реакцией. У меня есть простая страница, которую я тестирую, на которой есть сетка данных, которая не импортирует файлы scss или css. В index.html у меня есть тег ссылки со следующим синтаксисом
Я запустил его в Chrome и проверил вкладку «Сеть». Я увидел, что вышеуказанные таблицы стилей загружаются:
https://cdn3.devexpress.com/jslib/23.1. ... rkmoon.css https://fonts.googleapis.com/css?family ... 00,500,700 https://fonts.googleapis.com/earlyacces ... arabic.css Сайт нигде не менялся на тему Новолуния.
Простая страница выглядит так.
import React, { useState, useEffect, useRef } из 'реагировать'; импортировать DataGrid, {HeaderFilter, Editing, Paging, Pager, FilterRow, SearchPanel, StateStoring, Column, Scrolling } из «devextreme-react/data-grid»; импортировать {stringify} из "сглаженного"; //импортируем 'devextreme/dist/css/dx.light.css'; //импорт './meters.scss'; const MetersPage = () => { const [данные, setData] = useState([]); // Управляем состоянием данных const [filterValues, setFilterValues] = useState(""); const dataGridRef = useRef (нуль); /* const applyFilter = () => { пусть значения = filterValues.replace(/\s+/g, "").split(','); если (dataGridRef.current) { dataGridRef.current.instance.columnOption("EXTNL_MTR_ID", "filterValues", значения); } }; const ClearFilter = () => { setFilterValues(""); // Очистка значений фильтра если (dataGridRef.current) { dataGridRef.current.instance.columnOption("EXTNL_MTR_ID", "filterValues", null); } }; */ const fetchData = () => { // Выполняем вызов API для получения данных из серверной части Django выборка('https://vm-devmdms02/meters2/') .then((ответ) => ответ.json()) .then((данные) => setData(данные)) .catch((ошибка) => { console.error(ошибка); }); }; const handleSave = (изменения: любые) => { // Клонируем объект изменений, чтобы избежать изменения исходного объекта const clonedChanges = {...изменения}; // Удалить свойства с циклическими ссылками const сериализованные данные = stringify (clonedChanges); // Выполняем вызов API, чтобы сохранить измененные изменения в бэкэнде Django fetch('https://vm-devmdms02/meters2/', { метод: 'POST', тело: сериализованные данные, заголовки: { «Тип контента»: «приложение/json», }, }) .then((ответ) => ответ.json()) .then(() => { // В случае успеха извлекаем обновленные данные и обновляем сетку выборка данных(); }); }; useEffect(() => { выборка данных(); // Получаем данные о монтировании компонента }, []); возвращаться ( ); }; экспортировать MetersPage по умолчанию; Может кто-нибудь сказать мне, что я делаю не так?
Мобильная версия