Question

我正在用React创建这个自定义的单选按钮，我检查了几次，并且很确定我返回了地图中的标签，为什么会出现此警告？

-控制台-

webpackHotDevClient.js：198 ./src/toolbox/Radio.js

C：... \ src \ toolbox \ Radio.js 12:46 warning预期会在此函数array-callback-return中返回一个值

✖1个问题（0个错误，1个警告）

-控制台-

import React from 'react';
import './Radio.less';

const getValueTextPair = (myProps) => {
    let obj;
    switch (Object.prototype.toString.apply(myProps.valTxt)) {
        case '[object String]':
            obj = { 0: myProps.valTxt };
            break;
        case '[object Array]':
            obj = {};
            myProps.valTxt.map((text, index) => {
                obj[index] = text;
            });
            break;
        default:  // [object Object]
            obj = myProps.valTxt;
            break;
    }
    return obj;
}

// to generate radio buttons
const genRd = (myProps) => {
    if (myProps.valTxt === undefined || myProps.valTxt === null) return null;
    let obj = getValueTextPair(myProps);

    return Object.keys(obj).map((index) => {
        return <li className='lird' key={index}>
            <label className='lblBtn'>
                <input type='radio' className='rd' name={myProps.name} value={index} />
                <div className='wrap'>
                    <span className='dot'></span>
                </div>
                <div className='rdText'>{obj[index]}</div>
            </label>
        </li>
    });
}

const Radio = (props) => {
    // props: 
    const myProps = {
        ...props,
        valTxt: props.valTxt,
        name: props.name,
        id: props.id
    };

    // to return a group of radio button
    return <ul id={myProps.id} className='radioBtn'>
        {genRd(myProps)}
    </ul>
}

export default Radio;

Answer 1

问题是

myProps.valTxt.map((text, index) => {
  obj[index] = text;
});

.map仅应用于创建新数组。如果要执行副作用，则应改用forEach：

myProps.valTxt.forEach((text, index) => {
  obj[index] = text;
});

如何解决警告“预期在此函数array-callback-return中返回值”

1 个答案: