如何從按鈕中獲取值？ 西裝外套

Question

我遇到了一個愚蠢的問題。 按下時，我有這段帶有按鈕值和方法的代碼，但是如何獲取按鈕值本身來更改計算器屏幕？

<div class="text-center">
     <div class="calc">
        <div class="calc_screen">
            <p>@equation</p>
        </div>
        <div class="calc_buttons">
            <button class="calc_button ac bg-grey" value="AC" @onclick = "GetValue">AC</button>
            <button class="calc_button plus-minus bg-grey" value="+/-" @onclick = "GetValue">>+/-</button>
            <button class="calc_button percent bg-grey" value="%" @onclick = "GetValue">%</button>
            <button class="calc_button division bg-orange" value="/" @onclick = "GetValue">/</button>
            <button class="calc_button seven" value="7" @onclick = "GetValue">7</button>
            <button class="calc_button eight" value="8" @onclick = "GetValue">8</button>
            <button class="calc_button nine" value="9" @onclick = "GetValue">9</button>
            <button class="calc_button multiply bg-orange" value="X" @onclick = "GetValue">X</button>
            <button class="calc_button four" value="4" @onclick = "GetValue">4</button>
            <button class="calc_button five" value="5" @onclick = "GetValue">5</button>
            <button class="calc_button six" value="6" @onclick = "GetValue">6</button>
            <button class="calc_button minus bg-orange" value="-" @onclick = "GetValue">-</button>
            <button class="calc_button one" value="1" @onclick = "GetValue">1</button>
            <button class="calc_button two" value="2" @onclick = "GetValue">2</button>
            <button class="calc_button three" value="3" @onclick = "GetValue">3</button>
            <button class="calc_button plus bg-orange" value="+" @onclick = "GetValue">+</button>
            <button class="calc_button zero" value="0" @onclick = "GetValue">0</button>
            <button class="calc_button dot" value="," @onclick = "GetValue">,</button>
            <button class="calc_button equal bg-orange" value="=" @onclick = "GetValue">=</button>
        </div>
    </div>
</div>
@code{
    private string equation = "0";
    private void GetValue(){
        equation =  "some value of the button";
    }
}

Answer 1

對於這種類型的事情，您需要將值傳遞給事件處理程序，就像這樣

<button @onclick=@(_=>GetValue("AC"))>AC</button>

而且，當然您的處理程序需要接受該值

private void GetValue(string value)
{
    equation =  value;
}

Answer 2

嘗試這樣的事情：

    private void GetValue(object sender, EventArgs e){
        equation =  sender.value;
    }

Answer 3

試試下面的代碼：

<div class="text-center">
    <div class="calc">
        <div class="calc_screen">
            <p>@equation</p>
        </div>
        <div class="calc_buttons">
            <button class="calc_button ac bg-grey" value="AC" @onclick="@(_=>GetValue("AC"))">AC</button>
            <button class="calc_button plus-minus bg-grey" value="+/-" @onclick="@(_=>GetValue("+/-"))">+/-</button>
            <button class="calc_button percent bg-grey" value="%" @onclick="@(_=>GetValue("%"))">%</button>
            <button class="calc_button division bg-orange" value="/" @onclick="@(_=>GetValue("/"))">/</button>
            <button class="calc_button seven" value="7" @onclick="@(_=>GetValue("7"))">7</button>
            <button class="calc_button eight" value="8" @onclick="@(_=>GetValue("8"))">8</button>
            <button class="calc_button nine" value="9" @onclick="@(_=>GetValue("9"))">9</button>
            <button class="calc_button multiply bg-orange" value="X" @onclick="@(_=>GetValue("X"))">X</button>
            <button class="calc_button four" value="4" @onclick="@(_=>GetValue("4"))">4</button>
            <button class="calc_button five" value="5" @onclick="@(_=>GetValue("5"))">5</button>
            <button class="calc_button six" value="6" @onclick="@(_=>GetValue("6"))">6</button>
            <button class="calc_button minus bg-orange" value="-" @onclick="@(_=>GetValue("-"))">-</button>
            <button class="calc_button one" value="1" @onclick="@(_=>GetValue("1"))">1</button>
            <button class="calc_button two" value="2" @onclick="@(_=>GetValue("2"))">2</button>
            <button class="calc_button three" value="3" @onclick="@(_=>GetValue("3"))">3</button>
            <button class="calc_button plus bg-orange" value="+" @onclick="@(_=>GetValue("+"))">+</button>
            <button class="calc_button zero" value="0" @onclick="@(_=>GetValue("0"))">0</button>
            <button class="calc_button dot" value="," @onclick="@(_=>GetValue(","))">,</button>
            <button class="calc_button equal bg-orange" value="=" @onclick="@(_=>GetValue("="))">=</button>
        </div>
    </div>
</div>
@code{
    private string equation = "0";
    private void GetValue(String StrValue)
    {
        equation = StrValue;
        StateHasChanged();
    }
}

並且不要忘記使用StateHasChanged(); 在調用方法之后。 結果：

Answer 4

你試過了嗎？

@code{
    private string equation = "0";
    private void GetValue(){
        equation =  document.getElementByClassName("calc_button").innerHTML;
    }
}