如圖： 是一個form表單，在頂部輸入數據點擊新增，怎么把數據插入到下面的表格中，并顯示。

頁面代碼：

編輯跳轉表單的代碼：

showEditForm=(text) =>{

const data_save = this.props.signal.data_save.data

const data_form = []

for (let j=0; j

for (let i=0; i

if(data_save[j].variety == text.variety){

this.setState({

okText: '保存',

modalVisible:true,

isCreate:false,

formTitle: '編輯交易信號'+' '+text.variety,

currentEditId:text.variety,

data_form:

data_form.valueOf(

data_form.push({

time:data_save[j].signal[i][0],

signal:data_save[j].signal[i][1]

})

),

})

/*console.log("data_form", data_form)*/

this.form.setFieldsValue({

...data_form

});

}

}

}

}

表單代碼：

import React from 'react'

import PropTypes from 'prop-types'

import { Table, Form, Card, Tooltip, Input, InputNumber, Radio, Modal,Select, Icon, Button, TimePicker } from 'antd';

import currencies from '../../common/currencies.js';

const FormItem = Form.Item

const format = 'HH:mm';

const AddSignal =(props) => {

console.log("form",props)

this.state ={

data: props.data,

loading: false,

}

console.log("state", this.state)

const handleSubmit = (e) => {

e.preventDefault();

form.validateFields((err, values) =>{

if(!err) {

this.state.data.valueOf(this.state.data.push(values))

console.log('form1', values, this.state.data)

}

})

}

const {visible, onCancel, onCreateOrSave, form, title, okText, initValues} = props;

const { getFieldDecorator } = form;

const clumn = [

{

title: '時間',

dataIndex: 'time',

width: 100,

editable: true,

},

{

title: '信號',

dataIndex: 'signal',

width: 120,

editable: true,

},

{

title: '操作',

dataIndex: 'action',

width: 30,

render: (text, record, index) => (

),

}]

return (

visible={visible}

title={title}

okText={okText}

onCancel={onCancel}

onOk={onCreateOrSave}>

{getFieldDecorator('time',{})(

/**/

)}

{getFieldDecorator('signal',{})(

[開始]

[結束交易]

[集合]

)}

新增

)

}

export default Form.create()(AddSignal)

總結

以上是生活随笔為你收集整理的怎么改HTML表单数据,form设置的数据怎么添加到table的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。