我有六个反应文件,每个文件都导出一个数组,并且我希望将六个文件减少为一个

问题描述 投票:0回答:1

我有6个文件,例如波纹管,我想将这6个文件减少为一个单独的文件,称为providers,然后可以将每个数组导入其他文件。

这些是我的六个文件

gastronomia.jsx

import _range from 'lodash/range';
// eslint-disable-next-line global-require, import/no-dynamic-require
export default _range(1, 5).map(i => require(`assets/experiences/gastronomia/${i}.png`));

deporte.jsx

import _range from 'lodash/range';
// eslint-disable-next-line global-require, import/no-dynamic-require
export default _range(1, 3).map(i => require(`assets/experiences/deporte/${i}.png`));

diversion.jsx

import _range from 'lodash/range';
// eslint-disable-next-line global-require, import/no-dynamic-require
export default _range(1, 4).map(i => require(`assets/experiences/diversion/${i}.png`));

giftcard.jsx

import _range from 'lodash/range';
// eslint-disable-next-line global-require, import/no-dynamic-require
export default _range(1, 12).map(i => require(`assets/experiences/giftcard/${i}.png`));

belleza.jsx

import _range from 'lodash/range';
// eslint-disable-next-line global-require, import/no-dynamic-require
export default _range(1, 3).map(i => require(`assets/experiences/belleza/${i}.png`));

productos.jsx

import _range from 'lodash/range';
// eslint-disable-next-line global-require, import/no-dynamic-require
export default _range(1, 2).map(i => require(`assets/experiences/productos/${i}.png`));

而且我想将所有这些都放在一个文件providers.jsx中,例如这样的东西:

import _range from 'lodash/range';
// eslint-disable-next-line global-require, import/no-dynamic-require

const gastronomiaExperience =  _range(1, 5).map(i => require(`assets/experiences/gastronomia/${i}.png`));

const giftcardExperience = _range(1, 12).map(i => require(`assets/experiences/giftcard/${i}.png`));

const deporteExperience =  _range(1, 3).map(i => require(`assets/experiences/deporte/${i}.png`));

const productosExperience = _range(1, 2).map(i => require(`assets/experiences/productos/${i}.png`));

const diversionExperience = _range(1, 4).map(i => require(`assets/experiences/diversion/${i}.png`));

const bellezaExperience = _range(1, 3).map(i => require(`assets/experiences/belleza/${i}.png`)); 

export default {gastronomiaExperience, giftcardExperience, deporteExperience, productosExperience, diversionExperience, bellezaExperience};

我不知道自己在做什么错,但这在尝试映射到另一个组件中的数组时给了我一个错误

TypeError:popoverCategory.map不是函数

当我每个人都有自己的文件时,这很好用

javascript reactjs
1个回答
0
投票

您需要将其导出为:

import _range from 'lodash/range';
// eslint-disable-next-line global-require, import/no-dynamic-require

export const gastronomiaExperience =  _range(1, 5).map(i => require(`assets/experiences/gastronomia/${i}.png`));

export const giftcardExperience = _range(1, 12).map(i => require(`assets/experiences/giftcard/${i}.png`));

export const deporteExperience =  _range(1, 3).map(i => require(`assets/experiences/deporte/${i}.png`));

export const productosExperience = _range(1, 2).map(i => require(`assets/experiences/productos/${i}.png`));

export const diversionExperience = _range(1, 4).map(i => require(`assets/experiences/diversion/${i}.png`));

export const bellezaExperience = _range(1, 3).map(i => require(`assets/experiences/belleza/${i}.png`)); 

然后像这样导入它:

import { bellezaExperience } from '../Your_File_Path';

希望这对您有用。

© www.soinside.com 2019 - 2024. All rights reserved.