機器人和ios的矢量圖標

Question

在https://www.npmjs.com/package/react-native-ionicons中 ，我們有兩種方法來加載ios和android的圖標。 我用@ expo / vector-icons的v9.0.0嘗試了這兩種方法。

我用這個聲明導入Ionicons：

import { Ionicons } from '@expo/vector-icons';

1. 從名稱中刪除ios / md

<Ionicons name="close-circle" size={25} style={{color: 'white'}} />

我得到以下錯誤，其他圖標名稱也會發生：

警告：失敗的道具類型：無效道具名稱的值閉合圈提供給圖標，預期的一個...

2. 如果我傳遞ios / android屬性，圖標就不會顯示，我沒有得到警告，例如：

<Ionicons ios="ios-close-circle" android="md-close-circle" size={25} style={{color: 'white'}} />

我目前的修復是基於如何在本機中創建跨平台圖標？ 。 我用：

<Ionicons name={${Platform.OS === "ios" ? "ios" : "md"}-close-circle} size={25} style={{color: 'white'}} />

有更簡單的方法嗎？

謝謝！

Answer 1

所以，警告提示你提供的名字與Ionicons的圖標不符。 解決它的兩種方法是

1. 將正確的名稱傳遞給組件。 要查找所有名稱， 請訪問此處
2. 從'@ expo / vector-icons / Ionicons'導入Ionicons。

希望能幫到你！

Answer 2

看來這是對我的疏忽。 @ expo / vector-icons的README狀態：

該庫是@ oblador / react-native-vector-icons周圍的兼容層，可與Expo資產系統配合使用。

我不知道是什么讓我查看https://www.npmjs.com/package/react-native-ionicons的文檔，但顯然可以應用的選項並不適用於@ oblador / react -native-vector-icons和@ expo / vector-icons ...

對於任何對帶有expo / vector-icons的跨平台圖標感興趣的人，您可以參考我如何在本機中創建跨平台圖標提供的問題和解決方案？