How to use umi-plugin-react - 10 common examples

export const Log = logItem => {
  const { type, date, message } = logItem;

  // const formatDate = moment(date).isValid() ? moment(date).format('YYYY-MM-DD HH:mm:ss') : '';
  const messageGroup = message.split('\n');
  return (
    <li>
      
        {typeof type === 'string' ? type.toLocaleUpperCase() : 'UNKNOW'}
      
      <p>
        {formatDate(date, {
          year: 'numeric',
          month: 'numeric',
          day: 'numeric',
          hour: 'numeric',
          minute: 'numeric',
          second: 'numeric',
        })}
        &nbsp;&nbsp;
      </p>
      <div>
        {messageGroup.map((msg, i) =&gt; (
          <p>
            
              {msg}
            
          </p></div></li>

{
      label: 'id',
      name: 'id',
      itemRender: <input type="hidden">,
      hidden: true,
    },
    {
      label: ,
      name: 'name',
      rules: [
        {
          required: true,
          message: ,
        },
      ],
      itemRender: <input placeholder="{formatMessage({">,
      formItemLayout: layout,
    },
    {
      label: ,
      name: 'urlRegex',
      rules: [
        {
          required: true,
          message: ,
        },
        {
          // @ts-ignore
          validator: urlRegexValidator.bind(this),
        },
      ],
      itemRender: <input placeholder="URL正则表达式">,

const SelectLang: React.FC = props => {
  const { className } = props;
  const selectedLang = getLocale();
  const changeLang = ({ key }: ClickParam): void => setLocale(key, false);
  const locales = [
    'zh-CN',
    // 'zh-TW',
    'en-US',
    // 'pt-BR'
  ];
  const languageLabels = {
    'zh-CN': '简体中文',
    'zh-TW': '繁体中文',
    'en-US': 'English',
    'pt-BR': 'Português',
  };
  const languageIcons = {
    'zh-CN': '🇨🇳',
    // 'zh-TW': '🇭🇰',

});
    }
  }, []);

  /**
   * init variables
   */
  const handleMenuCollapse = (payload: boolean): void =>
    dispatch &&
    dispatch({
      type: 'global/changeLayoutCollapsed',
      payload,
    });

  // set locale default as zh-CN
  setLocale('zh-CN');

  return (
     {
        if (menuItemProps.isUrl) {
          return defaultDom;
        }
        return {defaultDom};
      }}
      breadcrumbRender={(routers = []) => [
        {
          path: '/',
          breadcrumbName: formatMessage({
            id: 'menu.home',

value={prefix}
                onChange={this.changePrefix}
                style={{ width: '20%' }}
              >
                <option value="86">+86</option>
                <option value="87">+87</option>
              
              {getFieldDecorator('mobile', {
                rules: [
                  {
                    required: true,
                    message: formatMessage({ id: 'validation.phone-number.required' }),
                  },
                  {
                    pattern: /^\d{11}$/,
                    message: formatMessage({ id: 'validation.phone-number.wrong-format' }),
                  },
                ],
              })(
                <input placeholder="{formatMessage({" style="{{" size="large">
              )}
            
          
          
            
              
                {getFieldDecorator('captcha', {
                  rules: [

.then(() => {
        that.setState({
          selectedRows: selectedRows.filter(item => ids.indexOf(item.id) === -1),
        });
        if (that.pageRef.current) {
          that.pageRef.current.doSearch();
        }
        message.success(formatMessage({ id: 'component.common.text.deleted-success' }));
      })
      .catch(() => {});

onCancel={() => handleModalVisible()}
    >
      
        {form.getFieldDecorator('username', {
          initialValue: method === 'create' ? '' : user.username,
          rules: [
            {
              required: true,
              message: formatMessage({
                id: 'app.operator.user.form.name.required',
                defaultMessage: 'Please input user name',
              }),
              min: 1,
            },
          ],
        })(
          <input placeholder="{formatMessage({">
        )}
      

} = this.props;
    return (
      <div>
        <div>
          <form>
            
              {getFieldDecorator('email', {
                rules: [
                  {
                    required: true,
                    message: formatMessage({ id: 'app.settings.basic.email-message' }, {}),
                  },
                ],
              })(<input>)}
            
            
              {getFieldDecorator('name', {
                rules: [
                  {
                    required: true,
                    message: formatMessage({ id: 'app.settings.basic.nickname-message' }, {}),
                  },
                ],
              })(<input>)}
            
            
              {getFieldDecorator('profile', {
                rules: [
                  {
                    required: true,
                    message: formatMessage({ id: 'app.settings.basic.profile-message' }, {}),
                  },</form></div></div>

getPageTitle = (pathname: any, breadcrumbNameMap: any) => {
    const currRouterData = this.matchParamsPath(pathname, breadcrumbNameMap);

    if (!currRouterData) {
      return 'Ant Tabs';
    }
    const pageName = formatMessage({
      id: currRouterData.locale || currRouterData.name,
      defaultMessage: currRouterData.name,
    });

    return `${pageName} - Ant Tabs`;
  };

}
          ]
        })(
          <input type="mobile" size="large">}
            placeholder={`${formatMessage({ id: 'app.login.mobile' })}`}
          /&gt;
        )}
      
      
        {getFieldDecorator('code', {
          rules: [
            {
              required: true,
              message: formatMessage({ id: 'validation.verification-code.required' })
            }
          ]
        })(
          <input type="key" maxlength="{6}" autocomplete="off" size="large">}
            placeholder={`${formatMessage({ id: 'app.login.verification-code' })}`}
            suffix={
              
            }
          /&gt;
        )}