Blazor EditForm中Double转String的实现及报错解决

错误原因分析 #

1. 赋值运算符错误：@bind-Value="Convert.ToString(state.Profit)"是双向绑定语法，要求绑定目标必须是可赋值的变量/属性，但Convert.ToString()返回的是临时字符串，无法接收用户输入的反向赋值，因此报错。
2. 委托转换错误：按钮的@onclick绑定如果使用lambda包裹异步方法但未加async/await，或者方法返回类型与委托不匹配，会导致此错误。

正确实现方案 #

方案一：使用中间属性处理类型转换（适合自定义格式需求） #

在组件的@code块中添加一个字符串类型的中间属性，作为Double类型Profit和InputText之间的桥梁：

@code {
    // 假设state是你的模型实例
    private YourModelType state = new YourModelType();

    // 中间属性，处理Double与String的双向转换
    private string ProfitString
    {
        get => state.Profit.ToString("N2"); // 可自定义格式，比如保留两位小数
        set
        {
            // 尝试将输入的字符串转换为Double，处理无效输入
            if (double.TryParse(value, System.Globalization.NumberStyles.Any, System.Globalization.CultureInfo.CurrentCulture, out var parsedProfit))
            {
                state.Profit = parsedProfit;
            }
            // 可选：输入无效时的处理逻辑，比如提示用户或保留原值
        }
    }

    // 提交逻辑（示例异步方法）
    private async Task HandleSubmit()
    {
        // 你的表单提交代码
    }

    private void Close()
    {
        // 关闭弹窗/页面逻辑
    }
}

然后修改EditForm中的InputText绑定：

<p>
    <label>Profit</label>
    <InputText id="profit" @bind-Value="ProfitString" />
</p>

方案二：直接使用InputNumber组件（无需手动转换） #

如果不需要自定义字符串格式，Blazor提供了InputNumber组件可以直接绑定数值类型，无需手动转换：

<p>
    <label>Profit</label>
    <InputNumber id="profit" @bind-Value="state.Profit" />
</p>

修正按钮点击绑定错误 #

如果HandleSubmit是异步方法，按钮的点击事件需要使用async/await：

<button @onclick="async () => await HandleSubmit()" class="btn btn-danger">Edit</button>
<!-- 或者更简洁的写法 -->
<button @onclick="HandleSubmit" class="btn btn-danger">Edit</button>

如果是同步方法，直接绑定方法名即可：

<button @onclick="HandleSubmit" class="btn btn-danger">Edit</button>
<button @onclick="Close" class="btn btn-info">Close</button>

内容的提问来源于stack exchange，提问作者xoreee