React组件在导入到另一个组件时未返回预期的值。

huangapple go评论61阅读模式
英文:

React component not returning expected value when imported into another component

问题

以下是您要翻译的内容:

I am having trouble getting a boolean value from a separate component file to display properly in my main App.js file.

I created a separate file called Component.js where I defined a boolean variable called "test" and exported it. In App.js, I imported the variable and logged it to the console. However, the console is showing me the entire Component function definition instead of the boolean value.

This is my App.js:

import React, { useState } from "react";
import "./App.css";
import test from './Component';

export default function App() {
  console.log(test)
  return (
    <>
    </>
  )
}

This is my Component.js

import React, { useState } from "react";

export const test = true;

export default function Component() {

}
英文:

I am having trouble getting a boolean value from a separate component file to display properly in my main App.js file.

I created a separate file called Component.js where I defined a boolean variable called "test" and exported it. In App.js, I imported the variable and logged it to the console. However, the console is showing me the entire Component function definition instead of the boolean value.

This is my App.js:

import React, { useState } from &quot;react&quot;;
import &quot;./App.css&quot;;
import test from &#39;./Component&#39;

export default function App() {
  console.log(test)
  return (
    &lt;&gt;
   &lt;/&gt;
  )
}

This is my Component.js

import React, { useState } from &quot;react&quot;;

export const test = true;

export default function Component() {

}

答案1

得分: 2

你已导入了默认导出
仅导入测试模块

import React, { useState } from "react";
import "./App.css";
import { test } from './Component';

export default function App() {
  console.log(test);
  return (
   <>

   </>
  );
}
英文:

You have imported the default export
import only test module

import React, { useState } from &quot;react&quot;;
import &quot;./App.css&quot;;
import { test } from &#39;./Component&#39;

export default function App() {
  console.log(test)
  return (
   &lt;&gt;

   &lt;/&gt;
  )
}

huangapple
  • 本文由 发表于 2023年4月10日 21:06:58
  • 转载请务必保留本文链接:https://go.coder-hub.com/75977403.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定