Javascript 如何将材质社区图标与反应本机向量图标一起使用

我正在尝试在材质社区图标中使用店面图标。但是，我得到一个错误，它没有显示图标。这是我的代码：

import { StatusBar } from "expo-status-bar";
import React from "react";
import { StyleSheet, Text, View } from "react-native";
import { createMaterialBottomTabNavigator } from "@react-navigation/material-bottom-tabs";
import { NavigationContainer } from "@react-navigation/native";
import Icon from "react-native-vector-icons/MaterialCommunityIcons";

import Products from "./src/components/Products";
import Cart from "./src/components/Cart";
import Account from "./src/components/Account";

const Tab = createMaterialBottomTabNavigator();

export default class App extends React.Component {
  render() {
    return (
      <NavigationContainer>
        <Tab.Navigator
          initialRouteName="Browse"
          activeColor="#f0edf6"
          inactiveColor="#A3A3A3"
          barStyle={{ backgroundColor: "#515151" }}
        >
          <Tab.Screen
            name="Browse"
            component={Products}
            options={{
              tabBarLabel: "Browse",
              tabBarIcon: ({ color }) => (
                <Icon name="storefront-outline" color={color} size={26} />
              ),
            }}
          />
          <Tab.Screen name="Cart" component={Cart} />
          <Tab.Screen name="My Account" component={Account} />
        </Tab.Navigator>
      </NavigationContainer>
    );
  }
}

从“世博会状态栏”导入{StatusBar}；
从“React”导入React；
从“react native”导入{样式表、文本、视图}；
从“@react navigation/material bottom tabs”导入{createMaterialBottomTabNavigator}”；
从“@react-navigation/native”导入{NavigationContainer}”；
从“反应本机矢量图标/材料通信图标”导入图标；
从“/src/components/Products”导入产品；
从“/src/components/Cart”导入购物车；
从“/src/components/Account”导入帐户；
const Tab=createMaterialBottomTabNavigator（）；
导出默认类App扩展React.Component{
render（）{
返回(
(
),
}}
/>
);
}
}

我已经安装了矢量图标库和其他图标从离子例如工作

编辑：

我认为我需要将react-native链接到react-native矢量图标，但我收到一个错误，即术语“react-native”不能识别为cmdlet、函数、脚本文件或可操作程序的名称。检查名称的拼写，或者如果包含路径，请验证路径是否正确，然后重试。

编辑2：

---

我想这只是一些我无法访问的社区图标，包括“店面轮廓”和“店面”。也许它们已经被弃用了，但在搜索商店时仍然存在？感谢大家的帮助，但我将使用一个替代图标来解决我的问题，因为我已经阅读了矢量图标文档中的所有词干。

有两个选项可用于将本机矢量图标配置到项目中：

带有链接（反应本机<0.60

无链接（react native>0.60）

如果您想使用链接选项，您需要首先在全局范围内安装react native，为此，您可以在终端上运行下面的命令

npm install -g react-native-cli

此命令将帮助您将react-native全局安装到您的计算机，然后在您能够将react-native矢量图标库链接到您的项目以及任何其他库之后

但我不建议这样做，因为react native>0.60自行管理链接过程，所以您不需要自己链接库

只需阅读react本机矢量图标文档，无需链接即可。

---

按照以下步骤操作-

步骤-1：导入图标族

从“@expo/vector icons”导入{MaterialCommunityIcons}；

步骤2：渲染组件

---

在全局范围内安装react native不需要更多，您可以使用：

npx反应本机链接

---

只需补充一点：react本地纸张也是设计的好地方。他们有关于在react中使用矢量图标的文档

---

有关使用材质社区图标的更多信息，请查看“快速入门”下的内容。

您是否遵循了所有步骤？附：react-native链接仅适用于react-native版本<0.60刚刚注意到您使用的是Expo，我认为您无法安装react-native-vector图标。使用Instead是的，我遵循了这些步骤。我使用了不同的材质社区City图标：帐户、购物车和商店。这些图标因某些原因而起作用，所以我想我可以直接使用它们？但仍然不确定为什么其他图标不起作用。