Asp.net core mvc 我必须为电话字段创建哪种类型的asp.net核心MVC元素？

在我的asp.net core Razor页面中有一个电话字段，如下所示。我创建了三个输入字段，如下所示，我可以看到填充的模型

我想将此控件转换为可重用控件，如asp.net web表单用户控件。我查看了以下两个选项，但这些类型的组件是只读的，无法将

输入

标记绑定到模型

视图组件

标记助手

---

如何创建可在其他razor页面上重用的电话组件？

创建一个包含对象的每个属性的ViewModel

~/ViewModels/Shared/PhoneNumberViewModel.cs

接下来是创建组件的视图。如果要在表单上使用此模板，则需要在“EditorTemplates”文件夹中创建此模板。这将为输入提供将数据发布到控制器时所需的相关“名称”。如果您只是简单地显示这些信息，那么我将在“DisplayTemplates”文件夹中创建模板

~/Views/Shared/EditorTemplates/PhoneNumber.cshtml

如果对象不在控制器中，请确保实例化该对象。应该注意PhoneNumber对象，因为它是在HomeViewModel的构造函数中创建的

~/Controllers/HomeController.cs

最后，在视图本身中，只需调用EditorFor并传入PhoneNumber对象

/Views/Home/Index.cshtml

@模型HomeViewModel

@Html.EditorFor(x => x.PhoneNumber)

注意：如果在“DisplayTemplates”而不是“EditorTemplates”中创建模板，则需要使用@Html.DisplayFor（x=>x.PhoneNumber）。基本上，内置的MVC助手函数知道根据您使用的函数查找哪个文件夹

@Model PhoneNumberViewModel

<label>Phone</label>
@Html.TextBoxFor(x => x.Phone1) - @Html.TextBoxFor(x => x.Phone2) - @Html.TextBoxFor(x => x.Phone3)

public class HomeViewModel
{
    public HomeViewModel()
    {
         PhoneNumber = new PhoneNumber();
    }

    public PhoneNumberViewModel PhoneNumber { get; set; }
}

public class HomeController : Controller
{
    public IActionResult Index() 
    {
        var vm = new HomeViewModel();

        return View(vm);
    }
}

@Html.EditorFor(x => x.PhoneNumber)