前端控件

输入控件和展示控件

控件分为输入控件和展示控件，与模型中的 field  对应，每种类型的 field 对应一种或多种控件输入/展示控件。Field 详细参数

自动判断控件类型

因为 field 控件只能在 数据容器 中使用。所以在编写 xml 时不需要区别控件是输入控件还是展示控件，数据容器会做判断。例如：在 Form 数据容器中使用输入控件，而在 Table 中则使用展示控件。

例如：User 模型中有一个 age 的字段，类型为 Number，使用者只需在 xml 中写 <Field name="age" /> ，就能对应到 engine 中 <InputNumber>  控件。

---

默认控件用法

<Form model="user2_User" key="test">
  <Fields>
    <Field name="password" />
    <!-- name指向模型上定义的field -->
    <Field name="address.city" />
    <Field name="sex" />
    <Field name="name" />
    <Field name="locked" />
  </Fields>
</Form>

默认控件用法 renderType 不指定，默认取当前类型下的第一个控件。 使用者在大多数情况下不需要关心使用何种控件，engine 会根据模型上定义的 fieldTpye 类型选择相应的控件。 默认控件一览表

---

自定义控件用法

<!-- 单纯的指定rendeType -->
<Field name="sex" renderType="Radio" />

<!-- 指定rendeType，并且给控件传参数 -->
<Field name="classifies">
  <RenderType>
    <CascadeModelSelect parentField="parent" leafOnly="#{true}" />
  </RenderType>
</Field>

自定义控件用法 并不是无限制的，它的可选择范围是根据 字段类型 来定的。Boolean 、Enum、EnumMulti、ToMany、ToOne 这几种类型的字段，对应 engine 中的多个控件。 数据类型对应可选择控件可以参考以下控件类型一览表

---

控件类型一览表

字段类型	对应控件
	编辑态	展示态	搜索栏中
Text	Input	Text	Input
	TextArea		TextArea
	Select		Select
	RichTex	Action	RichText
	NonRelatedModelSelect		NonRelatedModelSelect
Date/DateTime	DatePicker	Date	RangePicker
			DatePicker
	MonthPicker		RangeMonthPicker
			MonthPicker
Time	TimePicker	Time	RangeTimePicker
			TimePicker
Number/Int/Float	InputNumber	Number	InputNumber
	Progress	Progress	RangeNumber
	Percent	Float	Percent
	Rate	Rate	Rate
	YearPicker	Number	YearRangePicker
			YearPicker
	NonRelatedModelSelect		NonRelatedModelSelect
Enum	SingleChoice/Select/Transfer/MultiChoice	Enum	Select
	Select/Transfer/MultiChoice
EnumMulti		EnumMulti
ToOne/ToMany	CascadeModelSelect	ModelSelect	CascadeModelSelect
	ModelSelect	MainField	ModelSelect
	Cascader
	TreeSelect
	Text
Json	Textarea	Text
	JsonEditor
	NonRelatedModelSelect	ModelInfo
	CascadeModelSelect
Boolean	SingleChoice	Boolean	Select
	Checkbox
	Select
	Switch		Switch
Address	Input	Address	Input
	Textarea		Textarea
Attachment	Attachment	Attachment
Image	Image	Image
Password	Password	Password	Password
Email	Email	Email	Email
Phone	Phone	Phone	Phone
Link	Link	Link
MultiText	Textarea	Input	Input
RichText	RichText	RichText	Input
	Textarea	Text
	Input
Rate	Rate	Rate
Currency	Currency	Currency	Currency
			RangeCurrency
GeoLocation	MapSelector	GeoLocation
GeoArea	MapSelector	GeoLocation
Combination	RangeTimePicker	Time	RangeTimePicker
	RangeMonthPicker	DateTime	RangeMonthPicker
	RangeNumber	Int	RangeNumber
	RangePercent	Float	RangePercent
	RangePicker	DateTime	RangePicker
	YearRangePicker	Int	YearRangePicker