Blazor University (33) form - editcontext, fieldidentifiers

Link to the original text ：https://blazor-university.com/forms/editcontext-fieldidentifiers-and-fieldstate/

EditContext、FieldIdentifiers and FieldState

Please note that , For those who want to know Blazor how “ Backstage ” For those who work , This is a high-level theme . This information is not required for normal use Blazor - But I think it might be useful to know the inside information .

Let's start by describing Blazor How to maintain the meta state of form data UML Picture start .

EditContext

whenever EditForm.Model change （ The object being modified in the form ） when , It will be carried out EditForm.OnParametersSet And create a new EditContext example .EditForm Component will this EditContext Declared as a cascading value ^[1], So that any component in the form can access it .

EditContext Is the table cell data holder of the object currently being edited . Edit the object in the form （ for example Person） when ,Blazor Need to know more about this object , To provide a richer user experience .Blazor Other information held tells us ：

• If the specific properties of the model have been changed manually .

• Which model properties have validation errors , What are these mistakes .

obviously , The model class being edited should only represent our specific business requirements , So having our model classes implement this extra UI state information would be a concern conflict —— therefore Blazor Store the extra information itself in EditContext in . This is it. EditForm In its Model Create a new EditContext Why , Because if Model change , be EditContext The information stored in is no longer relevant .

FieldIdentifier

FieldIdentifier The purpose of is to provide identification for specific attributes of an object . It is associated with System.Reflection.PropertyInfo Different , Because it identifies the properties of a particular object instance , The reflection identifies the properties of the class .

Given a with the name PostalCode Property of Address class , We can expect the following equality rules ：

value	Whether it is equal or not ？
// Reflection ： Same properties on different instances
address1.GetProperty(“ Postal Code ”); address2.GetProperty(“ Postal Code ”);	yes
// FieldIdentifier： The same attribute of the same instance
new FieldIdentifier(address1, “PostalCode”); new FieldIdentifier(address1, “PostalCode”);	yes
// FieldIdentifier： Same properties on different instances
new FieldIdentifier(address1, “PostalCode”);
new FieldIdentifier(address2, “PostalCode”);	no

When UI state （ For example, validation errors ） When an input value needs to be associated , We need some way to identify which input data this state is related to . In the past Web In technology , A string is usually used to identify a single input , Here are some examples ：

• EmailAddress

• HomeAddress.PostalCode

• WorkAddress.PostalCode

Once the user interface becomes complex , These paths can be very complex .

• Contacts[0].Name

• Contacts[0].ContactDetails[0].TelephoneNumber

• Contacts[0].ContactDetails[0].EmailAddress

• Contacts[9].ContactDetails[3].TelephoneNumber

Blazor Simplifies this process , Because its design allows it to always handle object and attribute identification in the same process . This enables us to identify any attribute of any object by storing two simple pieces of information .

1. Directly reference the object itself .2. The attribute name of the object .

The logo is now simple , also （ Different from string path ） Never have to change to take into account changes in data , For example, deleting items from an array . for example , In the string path method , If you want to delete the first contact in the list , You need to Contacts[9].ContactDetails[3].TelephoneNumber Change to Contacts[8].ContactDetails[3].TelephoneNumber.Blazor Of ObjectReference/PropertyName Method avoids this complexity .

Even if we write our own custom validator to talk to the server to determine validity （ For example, the availability of unique values , for example EmailAddress）, our Blazor The verifier will also get a FieldIdentifier Example , You can then correlate the results from the server call and directly use the correct properties of the correct object instance .

FieldState

FieldState Class contains additional information about any object properties .EditContext Class has Dictionary<FieldIdentifier, FieldState> Private properties of type - This makes Blazor Its additional status can be stored in a flat list for quick access .

Given the following model

protected override OnInitialized()
{
  var country1 = new Country
  {
    Code = "GB",
    Name = "Great Britain"
  };
  
  var address1 = new Address
  {
    Line1 = "The Mansion",
    Line2 = "Bletchley Park",
    Line3 = "Sherwood Drive",
    Town = "Bletchley",
    Area = "Milton Keynes",
    PostalCode = "MK3 6EB",
    Country = country1
  };
  
  var person1 = new Person
  {
    Name = "My name",
    Age = 12,
    HomeAddress = address1,
    TelephoneNumber = "[phone]"
  };
}

We want to see the following field identifiers ：

Be careful ： Entries are added to the dictionary only when needed .