Redux 表单字段数组无法显示纯文本值答案

【问题标题】：Redux form field array cannot show the plain text valueRedux 表单字段数组无法显示纯文本值
【发布时间】：2019-05-13 05:38:20
【问题描述】：

我使用 redux 形式来表示数据网格。使用

初始化 redux 表单

  InputForm = connect(
  state => ({
    initialValues: {
      cashAndInvestments:[
        {title:"Chequing", rate:5, amount:100},
        {title:"Savings for Taxes", rate:4, amount:1000}
      ]
    } 
  }),
  null
)(InputForm);

它适用于初始化部分。然后我使用 redux 表单字段数组来渲染表格。

import React from 'react';
import { Field } from 'redux-form';
import { Table } from "semantic-ui-react";

const RenderAssets = ({ fields }) => (
  <Table.Body>
    {fields.map((asset, index) => (
      <Table.Row key={index}>
        <Table.Cell>
          {asset.title}
        </Table.Cell>
        <Table.Cell>
          <Field 
            name={`${asset}.rate`}
            type="tel" 
            component="input" 
          />
        </Table.Cell>
        <Table.Cell>
          <Field 
            name={`${asset}.amount`} 
            type="tel" 
            component="input" 
          />
        </Table.Cell>
      </Table.Row>
    ))} 
  </Table.Body>
);  

export default RenderAssets;

正确填写费率和金额。但是，它在资产标题的 Table.Cell 中显示为空。我想以纯文本而不是表单字段显示资产标题。谁能帮帮我？

谢谢，彼得

【问题讨论】：

标签： reactjs redux redux-form

【解决方案1】：

如果您想访问Field 之外的fieldArray 项目的值，您可以在map 函数中使用第三个参数fields（here 您可以找到文档）：

 {fields.map((asset, index, members) => (
    <Table.Row key={index}>
      <Table.Cell>
        {members.get(index).title} 
   ....

【讨论】：