Javascript 未能成功地在函数中解构对象

我有一个js文件名

index.js

在一个文件夹

utils

在文件中：

export const colors = {
  PRIMARY_COLOR: "#ff304f",
  SECONDARY_COLOR: "#002651",
  BORDER_COLOR: "#dbdbdb",
};

我尝试在我的

WeatherInfo

组件中对其进行如下分解：

import React from "react";
import { StyleSheet, View, Text, Image } from "react-native";

import { colors } from "../utils";

export default function WeatherInfo({ currentWeather }) {

  const { PRIMARY_COLOR } = colors;
  // console.log(colors);

  return (
    <View>
      <Text style={styles.textPrimary}>{temp}</Text>
    </View>
  );
}

const styles = StyleSheet.create({
  textPrimary: {
    fontSize: 40,
    color: PRIMARY_COLOR,
  },
});

从“React”导入React；
从“react native”导入{样式表、视图、文本、图像}；
从“./utils”导入{colors}；
导出默认函数WeatherInfo（{currentWeather}）{
常量{PRIMARY_COLOR}=颜色；
//控制台日志（颜色）；
返回(
{temp}
);
}
const styles=StyleSheet.create({
textPrimary：{
尺寸：40，
颜色：原色，
},
});

---

我的错误是说

找不到变量：PRIMARY\u COLOR

，但是如果我在函数中使用

console.log（colors）

，我可以在expo控制台中看到打印的对象。但是，如果我在函数之外执行此操作，它就会工作。有人能给我解释一下发生了什么吗？

你做得不错，但你只是把代码放错了地方——它应该在函数体之外——这就是它在整个页面上的可用性

const { PRIMARY_COLOR } = colors;

---

只向上移动一行。

解构成功，但

主颜色

只能在定义它的函数体中访问；我建议读一下示波器。好的，我明白了。我想我明白了。这是因为我分解了函数中的颜色。但是styles对象不在函数范围内，这就是我无法访问主颜色的原因。谢谢，我犯了一个愚蠢的错误，谢谢@jornsharpejust移出函数，在模块开始时，整个模块都会看到它。