zent/src/form/demos/11.normalizer.md

一套前端设计语言和基于React的实现

---
order: 11
zh-CN:
	title: 格式化表单值
	actualValue: 实际值：
en-US:
	title: Normalizers
	actualValue: Actual Value：
---

```jsx
import { FormInputField, Form, FormStrategy, Validators } from 'zent';

function App() {
	const form = Form.useForm(FormStrategy.View);
	return (
		<Form layout="vertical" form={form}>
			<FormInputField
				name="field1"
				label="field1"
				normalizeBeforeBlur={value => value.trim()}
				normalize={value => value.toUpperCase()}
				format={value => value.toLowerCase()}
			/>
			<label>{i18n.actualValue}</label>
			<Form.FieldValue name="field1" />
		</Form>
	);
}

ReactDOM.render(<App />, mountNode);
```