我无法在 blazor 应用程序中调用 C# 函数

Question

我正在尝试构建一个登录页面，但是当我尝试添加一些 C# 代码将眼睛图标从关闭更改为打开时。这是为了显示密码。问题是我认为我的 C# 代码没有被调用。

@page "/"


<form> 
    <div class="head-container">
        <label class="head-label" >Login</label>
        <div class="username-container">
            <label class="username-label" >Username</label>
            <input type="text" class="username-input" />
        </div>

        <div class="password-container">
            <label class="password-label" >Password</label>
                <div class="passwordInp-container" >
                    <input type="password" class="password-input" id="password-input" />



                      <!-- This is the Image im trying to change -->
                  <img src="@imageURL" class="password-eye" @onclick="ShowPassword" id="eye"/>




                </div>
        </div>
        <input type="submit" value="Submit" class="submit-button" />
        <p class="newUserPassword"><a href="" class="aTag">Register</a></p>
    </div>
</form> 


@code {
    public string imageURL = "/media/eye-closed.ico";

    public void ShowPassword()
    {

        Console.WriteLine("ShowPassword method called");

        if (imageURL == "/media/eye-closed.ico")
        {
            imageURL = "/media/eye-open.ico";
        }
        else
        {
            imageURL = "/media/eye-closed.ico";
        }
    }

}

感谢您提前提供的任何帮助！

我尝试在函数中包含 Console.WriteLine()，但即使这样也不会显示。但是 imageURL 变量被设置为所需的路径，因此代码正在运行，而不是函数。

Answer 1

我刚刚测试了这个，你发布的代码对我有用。

你确定eye-close.ico和eye-open.ico不是同一个图片吗？

执行以下操作怎么样：

@code {
    public string imageURL = "/media/eye-closed.ico";

    public void ShowPassword()
    {
        if (imageURL == "/media/eye-closed.ico")
        {
            imageURL = "";
        }
        else
        {
            imageURL = "/media/eye-closed.ico";
        }
    }

}

这是否会使图像在点击时消失？

（本来可以将此作为评论发布，但显然需要更多代表才能做到这一点）