Question

我正在使用React应用，并且在日志中不断出现此错误：

./src/CustomIndividualSelections/CustomIndividualSelections.js

Line 10:  Your render method should have return statement  react/require-render-return

Search for the keywords to learn more about each error.

以下是被引用的CustomIndividualSelections组件：

import React from 'react';
import slugify from 'slugify';
import CustomSelections2 from '../CustomSelections2/CustomSelections2';

const USCurrencyFormat = new Intl.NumberFormat('en-US', {
    style: 'currency',
    currency: 'USD'
});

class CustomIndividualSelections extends React.Component {
    render() {
        const { selectedFeatures } = this.props;
        const features = return Object.keys(this.props.featuresAvailable).map((feature, idx) => {
            const featureHash = feature + '-' + idx;
            const options = this.props.featuresAvailable[feature].map(item => {
                const itemHash = slugify(JSON.stringify(item));
                const featuresAvailable = Object.keys(this.props.featuresAvailable)
                    .map((feature, idx) =>
                        <div key={itemHash} className="feature__item">
                            <input
                                type="radio"
                                id={itemHash}
                                className="feature__option"
                                name={slugify(feature)}
                                checked={item.name === selectedFeatures[feature].name}
                                onChange={e => this.updateFeature(feature, item)}
                            />
                            <label htmlFor={itemHash} className="feature__label">
                                {item.name} ({USCurrencyFormat.format(item.cost)})
                            </label>
                        </div>
                    );
                return (
                    <form>
                        <CustomSelections2 features={features} />
                    </form>
                );
            });
        });
    };
}

export default CustomIndividualSelections;

从技术上讲渲染器内部有回报，所以我不确定为什么它说没有。有什么想法吗？

Answer 1

您的退货声明不在正确的位置。另外，您不能将变量分配给return语句

class CustomIndividualSelections extends React.Component {
  render() {
    const { selectedFeatures } = this.props
    const features = Object.keys(this.props.featuresAvailable).map(
      (feature, idx) => {
        const featureHash = feature + '-' + idx
        const options = this.props.featuresAvailable[feature].map(item => {
          const itemHash = slugify(JSON.stringify(item))
          const featuresAvailable = Object.keys(
            this.props.featuresAvailable
          ).map((feature, idx) => (
            <div key={itemHash} className="feature__item">
              <input
                type="radio"
                id={itemHash}
                className="feature__option"
                name={slugify(feature)}
                checked={item.name === selectedFeatures[feature].name}
                onChange={e => this.updateFeature(feature, item)}
              />
              <label htmlFor={itemHash} className="feature__label">
                {item.name} ({USCurrencyFormat.format(item.cost)})
              </label>
            </div>
          ))
        })
      }
    )
    return (
      <form>
        <CustomSelections2 features={features} />
      </form>
    )
  }
}

当渲染中已经有return语句时，如何处理“您的render方法应该具有return语句”错误？

1 个答案: