vb.net form 最大化按钮代码_【React】利用antd的form自定义表单控件

由于业务的需求，需要对Form表单进行自定义控件操作

业务需求如下：

首先点击选择按钮---在弹窗中选择产品--将选择好的产品展示在页面上，关于自定义组件的封装网上大牛的方法大多是封装好新的组件，从而能够在点击保存的时候获取到自定义的value

但是今天给大家提供另一种思路：只是将组件放在getFieldDecorator中，点击保存的时候通过this.props.form.validateFields方法中的values加入要传给后台的新的参数

具体实现代码如下：

//展示产品的list放在选择产品下面showProductList =()=> {let ProductList = this.state.ProductListreturn ProductList && ProductList.map((item,index) => {return <div key={index}>{item.name}</div>})}const SELECTBTN = <FormItem label={label} {...formItemLayout} key={field}>{getFieldDecorator(field, {rules:[{initialValue: initialValue,required:required,message: requiredMsg,}]})(<div><Button type="primary" onClick = {this.chooseProduct}>选择</Button>{this.showProductList()}  {/* 展示产品list */}</div>)}</FormItem>

点击保存得时候,在values中定义好要传给后台的参数,如：我需要传给后台需要的ids

handleFormSubmit = (e) => {e.preventDefault();this.props.form.validateFields((err, values) => {values.ids = [1,2,3] //这步骤是定义的，根据你的需求来修改参数值console.log('Received values of form: ', values); //这样打印出来的value中就有ids了});//this.requestLIst()然后这块可以请求接口把参数传过去了}

这样就能实现了哇～

vb.net form 最大化按钮代码_【React】利用antd的form自定义表单控件相关推荐

Antd Form 自定义表单控件
首先我们直接在自定义组件中打印看一下props能得到什么: 可以看到Form.Item向我们的自定义组件内部传递了一个value和一个onChange事件那么我们可以在自己定义的组件内部维护好一个s ...
form表单控件及控件属性
今天又学习了前端的form控件,这是我第二遍学习,确实发现不少新东西,把自己觉得常用的记下来表单控件: **form:最主要的一个标签,但是这个元素不会生成可是化部分**属性:action:表单提交 ...
C# 添加Excel表单控件（Form Controls）
在Excel中,添加的控件可以和单元格关联,我们可以操作控件来修改单元格的内容,在下面的文章中,将介绍在Excel中添加几种不同的表单控件的方法,包括: 添加文本框(Textbox) 单选按钮(Rad ...
react学习笔记(9)表单控件
1.表单控件的操作 1.数据双向绑定 demo1: 在输入框中输入或者删除数据时,可以实时监控. class App extends React.Component {state = {val : & ...
ExtJs简单form表单控件
ExtJs常用表单控件 2011-05-31 18:14 我们还是从最简单的代码实例开始吧:  <body> <div id="for ...
excel 表单控件按钮_Excel表单控制按钮怪癖
excel 表单控件按钮 If you're building an Excel workbook for other people to use, you can add form control ...
Form表单控件与浮动
Form表单控件第一点: 文本域 textarea 语法属性 name:控件的名字 cols:指定文本域的列数,变相设置宽度 rows:指定文本域的行数,变相设置高度 readonly:只读 pl ...
表单控件——form
表单控件指的不是表单是input那些标签 select button 如果把控件放在form标签内部就会有他们各自的系统自带的功能 action是一个网址 ==>当用户点击提交了以后会把打包的 ...
antd自定义form表单控件
用 getFieldDecorator 方法包裹的表单控件会自动添加 value (或由 valuePropName 指定的属性名) 和 onChange (或由 trigger 指定的属性名)属性, ...

vb.net form 最大化按钮代码_【React】利用antd的form自定义表单控件

vb.net form 最大化按钮代码_【React】利用antd的form自定义表单控件相关推荐

最新文章

热门文章

vb.net form 最大化按钮 代码_【React】利用antd的form自定义表单控件

vb.net form 最大化按钮 代码_【React】利用antd的form自定义表单控件相关推荐

最新文章

热门文章

vb.net form 最大化按钮代码_【React】利用antd的form自定义表单控件

vb.net form 最大化按钮代码_【React】利用antd的form自定义表单控件相关推荐