Question

formFields.js

export const invoiceFormFields = [
    {label: 'First Name', name: 'firstName', type: 'text'},
    {label: 'Last Name', name: 'lastName', type: 'text'},
    {label: 'Deliverables', name: 'deliverables', type: 'text'},
    {label: 'Email', name: 'email', type: 'email'},
    {label: 'Amount', name: 'amount', type: 'number'}
]

InvoiceForm.js

import React, { useContext } from 'react'
import { NewInvoiceContext } from '../../contexts/newInvoice.context'
import { Link } from 'react-router-dom'
import {
    Typography,
    Paper,
    TextField,
    makeStyles,
    Button,
    CssBaseline,
} from '@material-ui/core'

import { invoiceFormFields } from './formFields'

const useStyles = makeStyles((theme) => ({
    title: {
        marginBottom: '1rem',
    },
    form: {
        display: 'flex',
        flexDirection: 'column',
    },
    formInput: {
        marginTop: '1rem',
    },
    formButtons: {
        display: 'flex',
        marginTop: '2rem',
        justifyContent: 'space-between',
    },
}))

const InvoiceForm = ({ history }) => {
    const classes = useStyles()
    const {formDetails, handleFormChange, handleShowReview} = useContext(NewInvoiceContext)

    const newInvoiceFields = invoiceFormFields.map(({ label, name, type }) => (
        <TextField
            key={name}
            label={label}
            name={name}
            className={classes.formInput}
            type={type}
            required
            onChange={handleFormChange}
            value={formDetails[name]}
        />
    ))


}

export default InvoiceForm

我遇到了错误

尝试导入错误：“ ./ formFields”不包含默认导出（导入为“ formFields”）。

从我看到的内容来看，我正在正确地进行导出和导入-有人对这里可能发生的事情有任何想法吗？

谢谢

Answer 1

我想这会使它工作。

export const invoiceFormFields = [
    {label: 'First Name', name: 'firstName', type: 'text'},
    {label: 'Last Name', name: 'lastName', type: 'text'},
    {label: 'Deliverables', name: 'deliverables', type: 'text'},
    {label: 'Email', name: 'email', type: 'email'},
    {label: 'Amount', name: 'amount', type: 'number'}
];

export default {
    invoiceFormFields,
}

import { invoiceFormFields } from './formFields';

JavaScript无法从另一个文件导入变量

1 个答案: