为什么在使用两个格子的时候在一个格子上使用 focusin 两个格子会有反应？

Question

我用的是blazor，syncfusion 下面的代码是一个同步融合网格的例子。我想知道选择了哪个网格，或者直接在 onfocusin 中使用函数聚焦。因为，这是决定是在主网格中添加一行还是在详细网格中添加一行。现在它只在初始化时调用一次，不起作用 'onclick'、'onfocusin' 我应该怎么办？我想要下面的格式。例如）

@page "/counter"

@code {
    public aaa bbb { get; set; } = new();
}

<SfSplitter Height="100%" SeparatorSize="3" Orientation="Syncfusion.Blazor.Layouts.Orientation.Horizontal">
    <SplitterPanes>
        <SplitterPane Size="50%" Collapsible="true" CssClass="p-1">
            <ContentTemplate>
                <SfGrid ID="master" @onclick="@bbb.grid_onfocusin("master")"
                        DataSource="@Orders"
                        GridLines="GridLine.Both" Width="100%"
                        AllowSorting="false" AllowRowDragAndDrop="false" AllowGrouping="false">
                    <GridColumns>
                        <GridColumn Field=@nameof(Order.OrderID) HeaderText="Order ID" TextAlign="TextAlign.Right" Width="120"></GridColumn>
                        <GridColumn Field=@nameof(Order.CustomerID) HeaderText="Customer Name" Width="150"></GridColumn>
                        <GridColumn Field=@nameof(Order.OrderDate) HeaderText=" Order Date" Format="d" Type="ColumnType.Date" TextAlign="TextAlign.Right" Width="130"></GridColumn>
                        <GridColumn Field=@nameof(Order.Freight) HeaderText="Freight" Format="C2" TextAlign="TextAlign.Right" Width="120"></GridColumn>
                    </GridColumns>
                </SfGrid>
            </ContentTemplate>
        </SplitterPane>
        <SplitterPane Size="50%" Collapsible="true" CssClass="p-1">
            <ContentTemplate>
                <SfGrid ID="detail" @onclick="@bbb.grid_onfocusin("detail")"
                        DataSource="@Orders"
                        GridLines="GridLine.Both" Width="100%"
                        AllowSorting="false" AllowRowDragAndDrop="false" AllowGrouping="false">
                    <GridColumns>
                        <GridColumn Field=@nameof(Order.OrderID) HeaderText="Order ID" TextAlign="TextAlign.Right" Width="120"></GridColumn>
                        <GridColumn Field=@nameof(Order.CustomerID) HeaderText="Customer Name" Width="150"></GridColumn>
                        <GridColumn Field=@nameof(Order.OrderDate) HeaderText=" Order Date" Format="d" Type="ColumnType.Date" TextAlign="TextAlign.Right" Width="130"></GridColumn>
                        <GridColumn Field=@nameof(Order.Freight) HeaderText="Freight" Format="C2" TextAlign="TextAlign.Right" Width="120"></GridColumn>
                    </GridColumns>
                </SfGrid>
            </ContentTemplate>
        </SplitterPane>
    </SplitterPanes>
</SfSplitter>



@code {
    public List<Order> Orders { get; set; }


    public class aaa
    {
        public aaa()
        {

        }

        public string focusGrid { get; set; } = "";

        public EventCallback grid_onfocusin(string GridName)
        {
            focusGrid = GridName;
            Console.WriteLine("focusGrid: " + focusGrid);
            return EventCallback.Empty;
        }
    }

    protected override void OnInitialized()
    {
        Orders = Enumerable.Range(1, 75).Select(x => new Order()
            {
                OrderID = 1000 + x,
                CustomerID = (new string[] { "ALFKI", "ANANTR", "ANTON", "BLONP", "BOLID" })[new Random().Next(5)],
                Freight = 2.1 * x,
                OrderDate = DateTime.Now.AddDays(-x),
            }).ToList();
    }

    public class Order
    {
        public int? OrderID { get; set; }
        public string CustomerID { get; set; }
        public DateTime? OrderDate { get; set; }
        public double? Freight { get; set; }
    }
}

Answer 1

您的语法错误 - 因此在网格渲染时调用了该方法。

像这样更改您的 onclick 处理程序：

@onclick="@( () => bbb.grid_onfocusin("master") )"

和

@onclick="@( () => bbb.grid_onfocusin("detail") )"

这些将配置网格以响应您预期的点击。

为什么在使用两个格子的时候在一个格子上使用 focusin 两个格子会有反应？

Why do the two grids react if you use focusin on one grid when using two grids?

c#

syncfusion

blazor

blazor-server-side