.env 变量导致我的对象值出现错误，这些值是我从 axios get 请求中获取的反应

Posted 2023-03-07

【中文标题】.env 变量导致我的对象值出现错误，这些值是我从 axios get 请求中获取的反应

【英文标题】：.env variables causes errors with my object values that im getting from an axios get request in react

【发布时间】：2022-01-22 13:24:27

【问题描述】：

所以我一直在使用 useState 和 axios 来获取在我的前端显示来自 mysql 数据库的值的请求。这一切都很好。但是，当我尝试在我的 get 请求中使用带有模板文字的 .env 变量时，我收到此错误 "TypeError: Cannot read properties of undefined (reading 'profile_pic')" (profile_pic) 来自数据库。我已经包含了一直到对象值“profile_pic”的代码

export default function Projectbody() 
    // const teacherId = 7
    const dotenv = require('dotenv').config();
    const teacherId = process.env.REACT_APP_LEVELUPWORKS_TEACHER_ID;
    const [results, setResults] = useState([])
    useEffect(() => 
     axios.get(`http://localhost:4000/getTeacherPhoto/$teacherId`)
  .then(res => setResults(res.data[0]))
            ,[])

  const [active, setActive] = useState('menuCollapse') //menuCollapse is default, revert after editing
  const [item, setItem] = useState('itemObjective')

    return(
        <>
         active === 'menuCollapse' && 
        <div className = "body-container"> 
            <div className = "body-menu" id = "Menu">
                <div className = "menu-item profile-pic"><img src = results.profile_pic className = "pic"></img></div>

我已经在页面顶部导入了 useState 和 UseEffect 以及 axios，但是在使用 .env 之前一切正常

这是我的.env 文件，它与public/src/package.json/node_modules 等（我认为它是根？）位于同一文件夹中，它也称为.env。

REACT_APP_LEVELUPWORKS_TEACHER_ID = 1

我还是新手，所以我很感激任何/所有帮助。

【问题讨论】：

这是 create-react-app 吗？

@Kid 是的。

如果是这样，你不需要使用dotenv。另外，你有没有尝试安慰teacherId ？

@Kid 是的，我不这么认为 dotenv lmao。是的，它没有声明。

移除dotenv，尝试控制台，重启服务器和lmk

【参考方案1】：

尝试在您的函数之外导入 dotenv。可能是组件挂载问题。