-1

前もって感謝します。

ボタンのクリック時に反応する入力値を状態に更新する方法。表の行にリストされた入力とボタンのリストがあります。特定のアイテムの状態配列を更新する必要があります。

コードは以下です

    <TableCard>
      <Table dataSource={itemListArray}>
        <Column
          title="ItemName"
          align="left"
          render={item => (
                    <div>
                      <Input value={item.Name} />
                      <Icon onClick={???} />
                     </div>
          )}
        />
      </Table>
    </TableCard>
4

1 に答える 1

1

を取得するレンダー用の新しいコンポーネントを作成する必要がありますitem。このコンポーネントでは、独自の状態を使用して、item

class Example extends React.Component {
      state: {
        itemListArray: [{ name: 'Name', noise: 'NA' }]
      }

      handleChange: Function = ({ index, name, value }) => {
        let newValueArray = [ ...itemListArray ]

        newValueArray[index] = {
          ...newValueArray[index],
          [name]: value,
        }

        this.setState({ itemListArray: newValueArray })
      }

      render() {
        const { itemListArray } = this.state

        return (
          <>
             <TableCard>
              <Table dataSource={itemListArray}>
                <Column
                  title="ItemName"
                  align="left"
                  render={(item, index) => (
                    <ExampleItem
                      item={item}
                      index={index}
                      onChange={this.handleChange}
                    />
                  )}
                />
              </Table>
            </TableCar
          </>
        );
      }
    }
    import React, { useState } from 'react';

    function ExampleItem({ item, index, onChange }) {
      handleClick: Function = () => {
        onChange({
          index,
          name: 'name',
          value: item.name + 'a',
        })
      }

      return (
        <>
          <Input value={item.name} />
          <Icon onClick={this.handleClick}>
            Add an A to name string
          </Icon>
        </>
      );
    }

于 2019-12-05T12:46:10.057 に答える