1

以下是简单的代码

 @page "/demo"
<h3>POCBlazor</h3>
Input 1 :<input type="text" value="@somedata" @onchange="changeValue" placeholder="text 1" />
Input 2 :<input type="text" placeholder="text 2" />
@code {
    public string somedata { get; set; }
    void changeValue(ChangeEventArgs eventArgs)
    {

        somedata = eventArgs.Value.ToString();
        somedata = somedata + "asdf";
        StateHasChanged();
    }
}

场景
1）我在输入 1 中添加新值，然后它用“asdf”表示，
例如：输入值“123”——调用 changeValue 函数——>输入 1 =“123asdf”

2）第二次我用相同的值更新输入 1触发更改事件并且代码有效，但输入 1
秒 中的值未更新 ：再次输入值“123” --- 调用 changeValue 函数 --> 输入 1 =“123”

4

1 回答 1

3

我不确定是什么问题，应该对此进行调查。有空的时候我会做的。你对你的经历是正确的。但是，如果您使用 @bind 指令，则可以获得所需的行为。这样做并验证....

 Input 1 :<input type="text" @bind="@Somedata" placeholder="text 1" />
 Input 2 :<input type="text" placeholder="text 2" />

 <p>@somedata</p>

 @code {

 private string somedata;

 public string Somedata 
 { 
  get {return somedata; }
  set{
    if( somedata != value)
   {
      somedata = value + "asdf";
   }
  }

}

}

我想我知道是什么问题...

<h3>POCBlazor</h3>
Input 1 :<input type="text" value="@Somedata" @onchange="changeValue"> 
placeholder="text 1" />
Input 2 :<input type="text" placeholder="text 2" />
<p>@Somedata</p>

@code {

   public string Somedata { get; set; }


   void changeValue(ChangeEventArgs eventArgs)
   {

       Somedata = eventArgs.Value.ToString();
       Somedata += "asdf";
   }
}
}

当您在文本框中输入值 123 时，将调用 onchnage 事件，并因此执行事件处理程序。因此 Somedata 属性包含值 123asdf。由于 change 事件是一个 UI 事件，因此会自动调用 StateHasChanged，它会通知组件其值已更改，应重新渲染。组件重新渲染，现在文本框，如上所述，包含值 123asdf。

当您再次输入值 123 时，处理周期会重复，但是，请查看您的代码：

somedata = eventArgs.Value.ToString();

值 123 分配给 somedata 现在 somedata === 123，对吗？

somedata = somedata + "asdf";

将字符串“asdf”添加到 somedata 的值，并将组合值分配给 somedata。现在 somedata 包含值 '123asdf"。这与之前的值相同，对吗？这意味着您的组件不会重新渲染，因为组件的状态没有改变。注意：StateHasChanged 方法只是一个一种通知组件它的状态已经改变，但是组件是决定是否重新渲染的，所以即使你在你的代码中使用它，组件也拒绝让步。顺便提一下，StateHasChanged方法的存在不是必需的，因为它是使用 UI 事件自动调用的。

下次输入 123 并 tab out 时，根本不会触发 change 事件。但是如果你下一步输入值 1234，属性和文本框都将具有组合值：1234asdf

此行为是设计使然...

于 2020-02-27T15:40:17.610 回答