Ant Plus, форма Ant Design еще никогда не была такой простой

Ant Design

Введение

Муравей ПлюсAnt Design FormУсовершенствованная версия на его основе инкапсулирует чрезвычайно удобный способ использования Form и упрощенный API компонентов, связанных с Form.

Документация

nanxiaobei.github.io/ant-plus

Функции

  • очень легко: Попрощайтесь с утомительнымform.getFieldDecoratorШаблонный код против подробногоrulesПроверить код.
  • прогрессивное улучшение: Если вы не используете новые функции, вы можете использовать компоненты в качестве компонентов в Ant Design.
  • Единая подсказка: может быть определен глобальноrulesПроверьте оперативную информацию, унифицируйте опыт, попрощайтесь с надоедливой настройкой и неуправляемостью.
  • Упрощенный API: общие API-интерфейсы компонентов, связанных с формами, упрощены для более плавной разработки.

Установить

Yarn

yarn add antx

npm

npm install antx

использовать

Пример:код sandbox.io / yes / текущий новый антипирен 87…

import { Form, Input, Button } from 'antx';

const Demo = ({ form }) => (
  <Form api={form} data={{ username: 'Emily' }}>
    <Input
      label="用户名"
      id="username"
      rules={['required', 'string', 'max=10']}
      max={10}
      msg="full"
    />
    <Button htmlType="submit">提交</Button>
  </Form>
);

export default Form.create()(Demo);

В Реквизите формы управления,idУникально идентифицирует поле формы,labelдля Form.Itemlabel.getFieldDecorator(id, options) optionsЭлементы в параметре можно напрямую использовать в свойствах компонента, напримерrules,initialValueЖдать.

Муравей Плюс такжеrulesПосле оптимизации вы можете использовать краткие строки для установки правил проверки. В то же время он обеспечивает лучший пользовательский интерфейс для запросов подтверждения.

Да все так просто и понятно. Полное введение в использование см.Документация компонента формы Ant Plus.

В сравнении

Сравнение кода использования Ant Plus и использование традиционного дизайна муравей для формы сборки.

代码对比图

Связь

GitHub: GitHub.com/школьные школы/…

npm: Уууу, эта лошадь plus.com/package/Anta…

наконец

Добро пожаловать, чтобы попробовать, добро пожаловать в Star, испытайте путь развития, который никогда не был таким простым.