Привет, мои друзья,

В этом посте я попытаюсь объяснить «Как добавить React в доступное веб-приложение .NET Core».

Во-первых, я создаю новый проект для этого поста. Вы можете использовать его и пройти этапы создания проекта.

Я выбираю второй шаг шаблона проекта. Мой проект будет веб-приложением.

Теперь мой проект готов к разработке. Перед тем, как начать разработку, я добавлю несколько пакетов для реакции. Это следующие пакеты.

  • React.AspNet
  • JavaScriptEngineSwitcher.ChakraCore
  • JavaScriptEngineSwitcher.ChakraCore.Native.win-x64 (Если вы используете Windows x86 или другую ОС, вам следует загрузить свою версию для этой ОС.)
  • JavaScriptEngineSwitcher.Extensions.MsDependencyInjection

После загрузки пакетов мы изменим файл startup.cs в нашем проекте. Во-первых, мы добавляем новые библиотеки в файл startup.cs. Это библиотеки следующие.

  • с использованием Microsoft.Extensions.DependencyInjection
  • с использованием JavaScriptEngineSwitcher.ChakraCore
  • с использованием JavaScriptEngineSwitcher.Extensions.MsDependencyInjection
  • используя React.AspNet

Моя страница выглядит следующим образом.

Мы добавим следующий код в конец метода configureservices.

Мы добавим следующий код в метод настройки. Этот код должен быть перед статическими файлами. Скриншот выглядит следующим образом.

Я создал папку JSX в wwwroot. Я напишу код реакции в этой папке. Давайте начнем.

Во-первых, я добавил новый div в макет главной страницы. (_layout.cshtml) Мои компоненты реакции будут использовать этот div.

Теперь я начну писать код реакции. Я добавляю новый файл jxs в свою папку jsx. Скриншот выглядит следующим образом.

Детали моего компонента следующие.

Напоследок я вызову этот файл на своей странице для работы. Я добавил следующие коды внизу моей главной страницы.

Ссылки на скрипт выглядят следующим образом.

Я запустил localhost, и это сработало!

Вы можете найти пример проекта в этой ссылке. Позже я напишу новый пост для примеров реакции.

Увидимся.

Удачи :)