Blazor点击计算器

Question

我是C#初学者，我想用C#和blazor编写一个计算器，但我不知道怎么做。我的HTML已经完成了，但我不知道blazor接口是如何工作的这是我的HTML：有人能告诉我该怎么开始吗？

@page "/calculator"
<PageTitle>Calculator</PageTitle>
<h1>Calculator</h1>
<div class="display">  
<p id="output">0</p>
<div class="first-row">
<button id="r1-1">C</button>
<button id="r1-3">%</button>
<button id="r1-4">/</button>
</div>
<div class="second-row">
<button id="r2-1" >7</button>
<button id="r2-2" >8</button>
<button id="r2-3" >9</button>
<button id="r2-4" >x</button>
</div>
<div class="third-row">
<button id="r3-1" >4</button>
<button id="r3-2" >5</button>
<button id="r3-3" >6</button>
<button id="r3-4" >-</button>
</div>
<div class="fourth-row">
<button id="r4-1"  >1</button>
<button id="r4-2"  >2</button>
<button id="r4-3"  >3</button>
<button id="r4-4"  >+</button>
</div>
<div class="fifth-row">
<button id="r5-1" >0</button>
<button id="r5-2" >.</button>
<button id="r5-3" >=</button>
</div>
</div>
@code {

}

Answer 1

对于blazor按钮，您需要添加onclick函数。

例如：

<button @onclick="() => SomeFunction(5)" id="r5-3">5</button>
@code
{
public void SomeFunction(int number)
{
Console.WriteLine(number);
}
}