将 const 导入另一个 file.js

Question

我在网上找到了以下实现 SearchBar 的代码，并将其保存在 searchBar.js 中。我想将此栏“导入”到新文件 Home.js 中，我该怎么做？搜索栏.jsimport * as React from 'react';import { Searchbar } from 'react-native-paper';export const MyComponent = () => {  const [searchQuery, setSearchQuery] = React.useState('');  const onChangeSearch = query => setSearchQuery(query);  return (    <Searchbar      placeholder="Search"      onChangeText={onChangeSearch}      value={searchQuery}    />  );};

Answer 1

来自 Home.js：

import { MyComponent } from './path/to/searchBar.js';

您可以像这样在组件内部使用它：

import { MyComponent } from './path/to/searchBar.js';

const Home = () => {

  return (

    <div className="Home">

      <MyComponent />

    </div>

  );

};

Answer 2

从“路径名”导入 { MyComponent }

你也可以做默认导出

在 searchBar.js 的最后一行导出默认的 MyComponent

然后你可以导入

从“路径名”导入 SearchBar

你可以使用任何没有花括号的名字