Почему Blazor не видит функцию JS в отдельном файле?

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

[2024-08-19T16:59:42.406Z] Error: Microsoft.JSInterop.JSException: Could not find 'getMessage' ('getMessage' was undefined).
Error: Could not find 'getMessage' ('getMessage' was undefined).
    at https://localhost:7151/_framework/blazor.web.js:1:734
    at Array.forEach (<anonymous>)
    at l.findFunction (https://localhost:7151/_framework/blazor.web.js:1:702)
    at b (https://localhost:7151/_framework/blazor.web.js:1:5445)
    at https://localhost:7151/_framework/blazor.web.js:1:3238
    at new Promise (<anonymous>)
    at y.beginInvokeJSFromDotNet (https://localhost:7151/_framework/blazor.web.js:1:3201)
    at gn._invokeClientMethod (https://localhost:7151/_framework/blazor.web.js:1:62841)
    at gn._processIncomingData (https://localhost:7151/_framework/blazor.web.js:1:60316)
    at connection.onreceive (https://localhost:7151/_framework/blazor.web.js:1:53957)
   at Microsoft.JSInterop.JSRuntime.InvokeAsync[TValue](Int64 targetInstanceId, String identifier, Object[] args)
   at BlazorApplication.Server.Components.ThemeButton.ChangeTheme()
   at Microsoft.AspNetCore.Components.ComponentBase.CallStateHasChangedOnAsyncCompletion(Task task)
   at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle, ComponentState owningComponentState)

Но если я правильно это определю в App.razor таким образом, то все будет хорошо.

<body>
    <Routes @rendermode = "InteractiveServer" />
    <script>
         window.getMessage = () => {
             return "Hello, World!";
         };
    </script> // Works
    
    <script src = "~/js/custom.js"></script> // Not works, but contains the same function

    <script src = "~/js/bootstrap.bundle.min.js"></script>
    <script src = "_framework/blazor.web.js"></script>
</body>

Компонент, в котором я использую JS-взаимодействие:

@inject IJSRuntime JS

<button class = "btn btn-outline-primary" @onclick = "ChangeTheme">Change theme</button>
<br />

<span>Message: @Text</span>

@code {
    private string Text = "";

    private async Task ChangeTheme()
    {
        Text = await JS.InvokeAsync<string>("window.getMessage");
    }
}

Я нашел похожие проблемы и решения для них, но ничего не исправило.

Я уже пробовал эти решения:

Ошибки Javascript компонента Blazor (Microsoft.JSInterop.JSException)

Не удалось найти свойство окна при взаимодействии JS с Blazor

Попробуйте переместить строку script для вашего пользовательского js ниже строки по умолчанию, созданной Blazor.

Bennyboy1973 20.08.2024 03:59
Для развертывания Сайтов с использованием Blazor, Angular и React с репозиторием на GitHub на Cloudflare
Для развертывания Сайтов с использованием Blazor, Angular и React с репозиторием на GitHub на Cloudflare
Как развернуть сайты с помощью Blazor, Angular и React с репозиторием на GitHub на Cloudflare.
4
1
51
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Во-первых, вы можете попробовать добавить ссылку без ~

<script src = "/js/custom.js"></script>

Во-вторых, вам может потребоваться пересобрать решение, чтобы новые скрипты заработали.

Другие вопросы по теме

Похожие вопросы