Нулевая стоимость для зажигания в Blazor Wrapper для нативного веб -компонента JS ⇐ C#

Место общения программистов C#
Anonymous
Нулевая стоимость для зажигания в Blazor Wrapper для нативного веб -компонента JS

Сообщение Anonymous »

Мы пытаемся создать обертку Blazor для нашей нативной библиотеки веб -компонентов JavaScript. Мы хотим захватить это событие и получить свойство Detail в Customevent , которое содержит текст текущего текстового поля:

Код: Выделить всё

library-input.js
:

Код: Выделить всё

#updateValue(value) {
// ... updating the native `value` attribute

const valueEvent = new CustomEvent("valueChange", {
detail: this.#value,
bubbles: true,
});

this.dispatchEvent(valueEvent);
}
< /code>
libraryInput.razor
:

Код: Выделить всё

@inject IJSRuntime JSRuntime
@namespace BlazorWrapperForLibrary
@using System.Text.Json




@code {
private ElementReference libInput;
private const string JAVASCRIPT_FILE = "/js/library-components.js";
private const string INTEROP_FILE = "/js/lib-input.interop.js";

private IJSObjectReference? Module { get; set; }
private IJSObjectReference? Interop { get; set; }

[Parameter]
public string? Value { get; set; }

[Parameter]
public EventCallback ValueChanged {get; set;}

protected override async Task OnAfterRenderAsync(bool firstRender)
{
if (firstRender)
{
Module = await JSRuntime.InvokeAsync("import", JAVASCRIPT_FILE);
Interop = await JSRuntime.InvokeAsync("import", INTEROP_FILE);
}
}
}
< /code>
CustomEvents.cs
:

Код: Выделить всё

public class InputValueChangeEventArgs : EventArgs
{
public string? detail { get; set; }
}

[EventHandler("onvalueChange", typeof(InputValueChangeEventArgs), enableStopPropagation: true, enablePreventDefault: true)]
public static class EventHandlers
{
}
< /code>
Counter.razor
:

Код: Выделить всё

@page "/counter"


@code {
private string newValue = "undefined";

private void InputChanged(InputValueChangeEventArgs value)
{
Console.WriteLine(value.detail);
}
}
Когда я добавляю слушатель событий для ValueChange в документе Я вижу, что свойство Detail успешно заполняется.

Код: Выделить всё

onGlobalEvent(e)
в blazor.server.js ) Я также могу увидеть свойство Detail , заполненное. ...... begininvokedotnetfromjs..1..dispatcheventasync..i [{"eventhandlerid": 7, "eventName": "ValueChange", "eventiforkInfo": null}, {}] . Я не уверен, что EventfieldInfo: null имеет какое -либо отношение к этому.>

Подробнее здесь: https://stackoverflow.com/questions/782 ... -component

Вернуться в «C#»