我希望实现蚂蚁设计网址验证。使用getfiledecoder如何做url验证。
<Form.Item label={label}>
{getFieldDecorator(fieldName, {
initialValue: initialValue,
rules: [
{
required: true,
whitespace: true,
message: errorMessage,
def
浏览 35提问于2019-07-17得票数 1
"antd": "^1.11.1",
"react": "^15.1.0",
"react-dom": "^15.1.0",
错误:未定义的TypeError: getFieldDecorator不是函数
蚂蚁设计演示：
import React, {Component} from 'react';
import { Form, Icon, Input, Button } from 'antd';
const FormItem = Form.Item;
const
浏览 5提问于2016-11-20得票数 9
我想验证密码使用蚂蚁设计与反应。但是，ant设计没有任何validation.How，我能做到吗？请帮帮我。
const LoginForm = Form.create()(props => {
const { getFieldDecorator } = props.form;
return (
<Form onSubmit={props.onSubmit} className="form-size form-margin">
<FormItem>
{getFieldDecorator("ema
浏览 3提问于2018-07-06得票数 5
1回答
FormattedMessage不工作在Form.Item元素内的蚂蚁设计，如果FormattedMessage以外的Form.Item元素工作良好。帮帮我!
FormattedMessage外部Form.Item元件工作良好
<Form.Item label={<FormattedMessage id="formSignIn.emailField" />}>
{form.getFieldDecorator('email', {
rules: [{ required: true, message: <Form
浏览 1提问于2019-07-15得票数 0
2回答
蚂蚁设计中的输入限制字符
、、、
我有蚂蚁设计形式输入，我需要限制一些字符被写在输入。
<Form.Item
{...formItemLayout}
label={this.props.intl.formatMessage({ id: 'customer.form.zipCode' })}
>
{getFieldDecorator('zip_code', {
validateTrigger: 'onBlur',
浏览 3提问于2019-09-20得票数 3
回答已采纳
我正在使用React.js中的蚂蚁设计。我正在尝试使用ant设计规则来验证电子邮件。我的正则表达式不工作。 <Form.Item>
{getFieldDecorator('email', {
initialValue:null,
rules: [
{
required: false,
pattern: new RegExp("/\S+@\S+\.\S+/"),
message:
浏览 86提问于2020-09-13得票数 3
回答已采纳
6回答
我需要一些帮助，我如何才能匹配密码的反应js。我使用了ant设计，第一个密码是工作的，但是对于符合密码，我声明它不起作用，我怎么能做到呢？
handlePasswordChange = event => {
this.setState({
password: event.target.value,
});
};
handleConfirmPassword = event => {
if (event.handleConfirmPassword !== event.handlePasswordChange) {
message.error('err
浏览 0提问于2018-07-02得票数 10
回答已采纳
我有一个蚂蚁设计的Form与Input作为FormItem。我只想大写和裁剪输入到输入中的所有文本，所以我希望它作为一个受控制的组件。由于不是使用value字段直接操作包装在getFieldDecorator中的组件的值，因此按照警告的建议，我将onChange事件与组件传递的setFieldsValue属性附加在一起。但是在为每个onChange事件调用setFieldsValue时，更改后的值似乎并没有反映在输入上。
有人能建议一下做这件事的正确方法吗？谢谢。我附加了我的代码的最小版本，去掉了不必要的函数
class AddProduct extends Component {
han
浏览 2提问于2017-07-09得票数 1
我使用的蚂蚁设计表格项目如下：
{getFieldDecorator('city', {initialValue:'a', rules: [{required:true,message:' '}]})(
<select onChange={onChange} className="form-control">
<option value='a' >a</option>
<option value='b' >b<
浏览 4提问于2017-12-30得票数 2
回答已采纳
表单使用蚂蚁设计，我在同一个.jsx文件中有两个表单。单击“表单提交”时，验证两个表单字段。我不想一次验证这两个表单，我想一次验证单个表单。例如,
export class form extends Component {
form1submit(e) {
e.preventDefault();
this.props.form.validateFields((err, values) => {
console.log(values)
if (!err) {
alert("Form1 validat
浏览 4提问于2017-12-01得票数 3
1回答
我正在用reactjs进行项目，我在形式上实现了一些验证。我实现了一个逻辑，如果有人在没有上传照片和视频的情况下单击next，然后向用户显示错误，那么验证首先运行良好，但当用户删除照片或视频时，单击next则表单无效。你能帮我验证一下我用的是蚂蚁设计表格吗?我会和你分享代码的，请帮助我，我真的被困住了。
码
<Form onSubmit={this.handleSubmit}>
<FormItem>
{getFieldDecorator('picture', {
rules: [
浏览 0提问于2018-12-05得票数 2
回答已采纳
2回答
我工作在ReactJS的项目，目前我正在使用蚂蚁设计文件上传.当用户选择视频时，我想预览视频。我是新手，无法完成我的任务。有谁能帮我预览一个视频吗？我将与您分享我的代码，您可以检查我的代码。谢谢
码
import React from 'react';
import styled from 'styled-components';
import 'antd/dist/antd.css';
import './styletwo.css';
import { Form, Upload, Button, Icon } from '
浏览 1提问于2018-12-05得票数 10
我使用的是蚂蚁设计，但我在一个无线电小组中遇到了麻烦。在我看来，RadioGroup上的onChange处理程序在单击单选按钮时触发，但在设置该单选按钮的值之前触发。
下面是一些示例代码
const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
console.log('field value', getFieldValue(name)); // previous value, not changed value.
};
const component =
getFieldDecor
浏览 43提问于2018-01-26得票数 2
1回答
我是新来的reactJS，我想显示错误信息时，有人离开空白的文件。表单已经被验证，但无法显示错误消息。我从(ant-design)复制了这个表单代码，我将共享它的链接来查看原始表单，它可以正常工作，但在我的表单中，错误消息不起作用。原始表单链接
我的表单代码
import React from 'react';
import styled from 'styled-components';
import 'antd/dist/antd.css';
import Input from 'antd/lib/input';
const
浏览 0提问于2018-11-24得票数 1
1回答
我用的是蚂蚁设计下拉菜单。我有来自API的动态数据，当我试图将这些数据呈现到中时，它将被表示为string。
因此，我使用这个库将字符串呈现为HTML，但它不起作用。
renderSocialMedia = () => {
if (this.props.weblookup) {
let socialmedialookup = this.props.weblookup
webitems = ""
return socialmedialookup.map((k, index) => {
if (k.name.toLowerCase() != "
浏览 4提问于2020-03-23得票数 3
回答已采纳
这是一个代码框，显示了我的问题
这使用了来自and的表单、输入和按钮组件。以下呈现函数不像预期的那样工作。当我输入表格时，它失去了对每一个按键的关注.
render() {
const { getFieldDecorator } = this.props.form;
const SimpleFormItem = ({ name, label }) => {
return (
<Form.Item label={label}>
{getFieldDecorator(name, {
rule
浏览 3提问于2020-01-02得票数 0
回答已采纳
2回答
如何在蚂蚁设计中异步验证表单字段？
<FormItem>
{getFieldDecorator('zipcode', {
initialValue: `${customer && customer.zipcode ? customer.zipcode : ''}`,
rules: [
// { required: true, message: 'Please input your Zipcode' },
{ validator: this.ha
浏览 0提问于2018-11-23得票数 10
回答已采纳
1回答
我正在用酶编写测试，但不知道如何模拟作为道具传递的函数。
it("should do not login when submit a user that not exist", () => {
const mock = jest.fn(() => true);
const wrapper = shallow(<HomeFormComponent form={{getFieldDecorator: () => mock()}}/>);
wrapper.find(Form).simulate("s
浏览 0提问于2018-10-19得票数 1
回答已采纳
2回答
我一直想弄清楚如何包装蚂蚁设计的表单组件。我有几个Select具有相同的选项，所以我想创建一个SelectWrapper (参见下面的片段)。不幸的是，antd的表单似乎不喜欢这个，并且会在
createBaseForm.js:98 Uncaught :无法读取未定义的属性“onChange”
尽管我通过表格道具到Select。
function ReusableCountrySelect({countries, ...props}) {
return (
<Select
{...props}
>
{
countr
浏览 1提问于2017-04-07得票数 2
回答已采纳
我被创建了一个注册页面使用react。在这里，我使用了以下的登记表。。所有验证都得到了正确的处理，在成功尝试之后，用户可以注册到系统。我面临的唯一问题是，提交后无法清除表单输入字段的值。
我已经实现了将表单字段值清除为null的方法。但它不起作用。我在堆栈溢出中尝试了以前类似的问题，但仍然找不到一个可行的问题。原因可能是因为我使用的是蚂蚁设计模板。
this.setState({
confirmDirty: false,
autoCompleteResult: [],
userName: '',
email: &#
浏览 2提问于2018-12-25得票数 20
回答已采纳
1回答
我正在使用ant设计构建一个基于Clean-UI模板的web应用程序。这是关于在我的项目中使用redux的问题。在ant设计中使用Redux的最佳实践是什么？我应该使用Redux-form还是RC-form？有没有使用Redux的内置ant设计解决方案？
第二个问题:我正在尝试构建一个带有复选框组的表单。当我的每个复选框都被选中时，redux中的状态将会改变，但我不能在我的UI中设置状态值。如何使用"mapPropsToFields"？
下面是我的代码：
import React from 'react'
import { connect } from '
浏览 0提问于2019-08-14得票数 1
我试图对表单做一个简单的Jest快照测试，但是在运行测试时我得到了错误：
Uncaught [TypeError: getFieldDecorator(...) is not a function]
我想我可以为getFieldDecorator创建一个存根，并将它传递到道具中，但是它不起作用。
这是一个考验：
it('renders correctly initially', () => {
const testForm = {
getFieldDecorator: jest.fn()
};
const wrapper = mount(
<Rout
浏览 0提问于2018-12-07得票数 6
回答已采纳
我已经创建了用创建-反应-应用程序和使用的蚂蚁设计组件，随着项目变得更大，我需要使用一些可怕的组件从蚂蚁设计-专业。
在现有的蚂蚁设计项目中有什么方法来集成ant-design-pro组件吗？
我试过导入和使用@ant-design/pro-布局，但对我来说没有用。
浏览 0提问于2019-06-07得票数 5
回答已采纳
在reactjs中，我使用ant-design库作为表单。在控制台中，我面临着以下问题：
警告:validateDOMNesting(.)：不能作为
有人能告诉我我在代码中犯了什么错误吗？
码
import React, { component } from 'react';
import styled from 'styled-components';
import 'antd/dist/antd.css';
import './FirstStep.css';
import { Form, Input } fr
浏览 0提问于2018-11-28得票数 0
我正在尝试在我的示例注册表单中使用ant设计表单，当我尝试使用setFieldsValue时，它抛出错误“除非使用了getFieldDecorator，否则无法使用setFieldsValue”。但是我已经在我的code.Here中使用了getFieldDecorator，这是我的代码的一个示例。
handleChange = (e) => {
const fname = e.target.name;
const fvalue = e.target.value;
this.props.setFieldsValue({
fname: fvalue
});
}
ren
浏览 3提问于2018-04-23得票数 4
回答已采纳
我有rc-form 2.4.8版本，我使用的是getFieldDecorator方法，它会引发
警告：defaultValue无效，因为getFieldDecorator将设置value，请改用option.initialValue。
我没有在代码中使用defaultValue
{getFieldDecorator('select', {
rules: [{
required: true,
message: 'Select t
浏览 3提问于2019-11-08得票数 0
回答已采纳
给定父组件，我使用的是一个子组件DynamicFieldSet，它是FormItems的一个分组。但我收到了一个错误：
Warning: validateDOMNesting(...): <form> cannot appear as a descendant of <form>. See CreateTopic > Form > form > ... > DynamicFieldSet > Form > form.
我试图删除子组件中的<Form> </Form>标记，但这是一个编译错误。
有什么方法可以禁用
浏览 3提问于2018-02-05得票数 17
我正在用React开发一个基于类的组件，我的代码看起来没问题，但即使它显示了一些语法错误，就像这样。-->无法对'this.props.form‘的属性'getFieldDecorator’进行结构分析，因为它未定义。 所以请告诉我如何解决这个问题 这是App.js import React, { Component } from "react";
import 'antd/dist/antd.css';
import { Form, Input, Button, Card, DatePicker, } from "antd
浏览 141提问于2021-07-26得票数 1
我想将与Antd的getFieldDecorator集成起来。
但在Antd的getFieldDecorator看来，它只支持自己的组件。
是否有任何方法将其用于其他包(如react-map-autocomplete )
浏览 2提问于2019-12-01得票数 2
回答已采纳
1回答
我想在我的表单中添加错误信息。目前，我正在使用ReactJs，并且我对reactJs来说是全新的，我使用了ant-设计表单和表单已经被验证，但是当有人离开空字段时，没有在文本中显示错误消息。请帮帮我，因为我真的被困住了。谢谢
表单代码
import React from 'react';
import styled from 'styled-components';
import 'antd/dist/antd.css';
import Input from 'antd/lib/input';
const FormCard =
浏览 1提问于2018-11-24得票数 1
回答已采纳
2回答
我是reactJS的新手，但我想知道如何在输入元素中放置图标？
我有一个FormItem，里面有一个输入，在这个输入中我想放一个图标。
<Col xs={24} sm={24} md={24} lg={12}>
<FormItem
{...formItemLayout}
label={intl.formatMessage({ id: `maintenace.link.linkOrigin` })}
>
{getFieldDecorator(`officePhone`, {
initialValue:
浏览 8提问于2022-03-31得票数 0
我是一个反应的初学者，我从反设计网站复制了登录表格的代码。但现在我收到了这条错误信息。你能帮我找出错误吗？
"'Readonly<{子？：ReactNode；}> & Readonly>‘找不到’窗体‘属性。“
这是代码：
class NormalLoginForm extends React.Component <{}, { value: string }>{
handleSubmit = (e: any) => {
e.preventDefault();
this.props.form.validateFields
浏览 0提问于2018-06-21得票数 0
我正在尝试遵循Ant设计文档提供的步骤，但是我得到了一个错误：
TypeError:无法读取未定义的属性“getFieldDecorator”
import React, { Component } from 'react'
import ReactDom from 'react-dom'
import { Icon, Input, Form} from 'antd'
//
import Header from './layout/Header'
// Import Css
import '../css/Hom
浏览 1提问于2017-12-30得票数 15
回答已采纳
1回答
当从下拉菜单中选择一个选项时，我需要显示某些输入。下拉菜单包含三个选项:血压、体重和温度。当用户选择一个选项时，与该选项相关的输入字段需要是可见的，其余字段是隐藏的。 例如，当用户选择血压时，收缩压和舒张压输入字段需要可见，温度和体重字段需要隐藏。 <Form.Item label="Vital">
{getFieldDecorator("vital", {
rules: [{ required: true, message: "Please select a vital!"
浏览 31提问于2019-03-20得票数 1
回答已采纳
我试图将表单数据发送到服务器，但是当我单击Next Button (向导表单)时，它会给我带来错误。我使用了向导表单，在步骤1中，当用户单击Next Button时，表单数据应该发送到服务器，但同时它会给我带来错误，并在控制台警告我(未定义的用户)：
“{错误: 400，原因：”匹配失败“，消息：”匹配失败400"，errorType："Meteor.Error"}
码
import React from 'react';
import 'antd/dist/antd.css';
import './WizarStyle.
浏览 3提问于2018-11-26得票数 0
1回答
我正在使用antd，我想在我的项目中使用它的。
注意事项：在添加此组件之前，我的项目(registration.js)工作正常，我刚刚复制和粘贴了and组件。
这是我的registration.js文件：
import { Form, Input, Tooltip, Icon, Cascader, Select, Row, Col, Checkbox, Button, AutoComplete } from 'antd';
const FormItem = Form.Item;
const Option = Select.Option;
const AutoCompleteO
浏览 0提问于2018-07-18得票数 0
回答已采纳
当我在带有getFieldDecorator的表单中的react.js中使用DatePicker时，一旦我选择了一个日期，它就会给出一个错误消息“DatePicker值不是一个字符串”。
我在没有窗体getFieldDecorator的情况下尝试了datepicker，它不会显示错误。但我需要在getFieldDecorator中使用DatePicker。
<FormItem
{...formItemLayout}
label="Start Date"
>
浏览 0提问于2018-12-27得票数 2
1回答
我试图在getFieldDecorator中添加一些自定义组件，并获得onCreate添加的值。不确定如何处理它，因为状态是在自定义组件中找到的。理想情况下，自定义组件将处理所有用户输入值，但不确定如何将这些值作为对象onCreate的一部分传递。
import React from "react";
import { Icon, Modal, Form, Input } from "antd";
import Tags from "./EditableTagGroup";
const Taskform = Form.create({ name
浏览 0提问于2019-11-30得票数 2
回答已采纳
我有密码重置表单：
{formItem(
props.form.getFieldDecorator('currentPassword', {
rules: [{ min: 6 },
{ validator: maybeMustBeRequared }
],
})(<Input type="password" />),
{
label: tUsers.currentPassword,
},
浏览 11提问于2019-07-25得票数 2
1回答
我使用的是Ant设计，我想禁用一个Form.Item 用户名字段。请看下面的示例代码，
<Form.Item disabled style={{ padding: '0px 20px' }}>
{getFieldDecorator('username', {
initialValue: this.state.userInfo.username,
validate: [
{
trigger: ['onChange', 'onBlur&
浏览 1提问于2020-04-23得票数 7
回答已采纳
2回答
我正在使用我的反应项目，我在表单上遇到了一些冲突，当我填写表单并关闭抽屉时，下次我再次打开抽屉时，填充值不清楚，有谁知道这方面的解决方案？
代码在这里
const { Option } = Select;
class DrawerForm extends React.Component {
state = { visible: false };
showDrawer = () => {
this.setState({
visible: true,
});
};
onClose = () => {
this.setState
浏览 5提问于2020-05-06得票数 0
回答已采纳
我无法在表单中为Inputfield设置值。下面是我的密码。甚至我也试图在输入元素中给出类似于value='ABC'中的直接值。但没有运气。当我试图在表单标记之外显示值时，如下所示
<h1>{this.state.company.companyCode}</h1>
这表明了价值。但不是在身体内部。
class UpdateCompany extends Component {
constructor(props) {
super(props);
this.state = {
浏览 0提问于2019-07-02得票数 0
回答已采纳
这几天我对React条件渲染有个问题。众所周知，当我们使用条件渲染来确定某些元素是否会被渲染，或者not.We必须用<div/>或其他东西包装这些元素时，以确保每个条件只返回一个对象。但很明显，包装器确实对html结构有一些影响，这对我们不好，特别是当我们在做列表或其他事情的时候。 所以我的问题是，如何使用条件渲染，而又不会对html产生任何结构效果？React在Vue中有没有类似于<template/>的东西，或者有其他方法来解决这个问题？ 谢谢大家！:) <Row>
{customerClass === &
浏览 34提问于2019-09-29得票数 1
1回答
我有一个模拟，机器人模拟蚂蚁的行为:在返回巢穴的路上，机器人留下了踪迹。在现实世界中，蚂蚁使用踪迹信息素来实现这一点。 为了在模拟中模拟这些信息素，我希望我的机器人在去巢的路上把Balls留在后面。所以我的问题是:我想从机器人的控制器代码中以编程方式创建Ball节点。 有可能做到这一点吗？我使用的是Java。
浏览 34提问于2020-04-30得票数 1
1回答
我使用FormItem作为应用UI表筛选条件，并使用Row和Col来布局组件。目前我面临的问题是，当用户缩放窗口时，FormItem无法自动适应屏幕的大小调整。因此，我想要使FormItem的灵活性，当用户缩放烤架窗口时，FormItem可以自动调整到多行以适应屏幕的自动变化。这是我使用的当前代码：
renderSimpleForm() {
const {
form,
dispatch,
loading,
activityM: { wordItems = [] },
activityM,
} = this.props;
浏览 2提问于2021-12-02得票数 0
回答已采纳
1回答
当我从Form.create中尝试时，我得到了一个类型记录错误
这是一个错误：
当我尝试使用此表单时，编辑：
import { Form, Icon, Input, Button, Checkbox } from 'antd';
const FormItem = Form.Item;
class NormalLoginForm extends React.Component {
handleSubmit = (e) => {
e.preventDefault();
this.props.form.validateFields((err,
浏览 3提问于2017-12-06得票数 6
我查看了ant.design表单的所有示例，但找不到验证文本框最小长度的方法。你能帮帮忙吗？
import { Form, Icon, Input, Button, Checkbox } from 'antd';
class NormalLoginForm extends React.Component {
handleSubmit = e => {
e.preventDefault();
this.props.form.validateFields((err, values) => {
if (!err) {
浏览 1提问于2019-07-19得票数 5
我正在使用ant设计制作一个不同的表单组件，并试图绑定几个不同的输入。
以下是代码：
this.state = {
title: '',
product: '',
options: 0,
price: 0,
}
onTitleChange = (e) => {
this.setState({
title: e.target.value
})
}
onProductChange = (e) => {
this.setState({
product: e.targ
浏览 0提问于2019-08-29得票数 2
回答已采纳
2回答
蚂蚁设计风格
、、
*蚂蚁设计-企业级产品()的设计系统
您知道在哪里可以找到className的所有antd组件的列表吗？
例如:在<Form/>中有一个组件antd，所以它是className is：.ant-form。(全球风格)
在哪里可以找到所有组件的classNames？
我能看看蚂蚁设计的所有风格吗？(在线/下载)
谢谢!
浏览 3提问于2021-10-27得票数 0
回答已采纳
我试图在一个React函数组件中访问antd 3x中的属性getFieldDecorator，但是我没能做到，我已经用谷歌搜索了一段时间，没有找到任何关于在无状态组件(函数组件)中使用getFieldDecorator的参考资料，我想知道是否有人遇到了同样的问题，如果你不需要更改为类组件就能解决它。 我的代码非常简单，一个包装在Form.Item中的输入 const FormItem = Form.Item
const inviteModal = ( {props}) => {
return(
<Form layout="vertical">
浏览 3提问于2021-06-30得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
