无法成功破坏函数内部的对象

问题描述

我在文件夹index.js中有一个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,},});

我说Can't find variable: PRIMARY_COLOR时出错，但是如果我在函数内console.log(colors)，则可以在EXPO控制台中看到打印的对象。但是，如果我在函数外部执行此操作，则它将起作用。有人可以告诉我发生了什么事吗？

解决方法

您做得对，但您只是将代码放错了位置，因此代码应位于函数主体之外，这将在整个页面上使用

const { PRIMARY_COLOR } = colors;

仅将其向上移动一行。