8、React Bootstrap个人联系人管理器开发指南

React Bootstrap个人联系人管理器开发指南

1. React中的特殊元素与绑定

在React中，由于 for 和 class 是JavaScript关键字，不能直接在标签和输入元素中使用。因此，我们使用 htmlFor 来替代 for ，使用 className 来替代 class 。这暗示着这些HTML元素是具有相似用途的副本，而非元素本身。

许多现代框架都采用绑定来简化输入更新和事件触发。绑定的核心思想是框架在UI元素和代码（如属性）之间建立连接，监控底层值的变化，并在检测到变化时触发更新。正确使用绑定可以减少代码编写的繁琐，降低错误率。

2. 状态绑定

在React中进行绑定时，需要有一个状态进行绑定。对于创建要在屏幕上显示的数据，状态可以是一个描述所需属性的接口。以单个联系人为例，状态可以定义如下：

export interface IPersonState {
  FirstName: string,
  LastName: string,
  Address1: string,
  Address2: StringOrNull,
  Town: string,
  County: string,
  PhoneNumber: string;
  Postcode: string,
  DateOfBirth: StringOrNull,
  PersonId : st