I recently had this same question and read several articles and posts about this. By no means I am an expert, but from what I found, there are varying opinions (Similar to where to store JWT tokens in an SPA. Google it, there is no straight answer…lol).
I think it really depends on what kind of app you are developing and what kind of data your API is serving.
For me, I chose to use capacitor/storage. With this option, a user could get access to the API key if they really wanted to or if their phone is compromised, it could be accessed. If a phone is compromised, there are bigger problems to worry about though 
For my app, these possible risks don’t warrant an encrypted option as we aren’t storing or serving confidential/personal information.
The ultimate most secure option is using an encrypted option like Ionic’s Identity Vault or Secure Storage. If I was developing a banking app or something like that, hands down I would use this. But, with my current app, I cannot justify the cost.
Some additional information, I am using Vue and Ionic 5 for my app. For caching my Vuex store, I am using Ionic Storage which stores the cache in several different options depending upon what is available (for me IndexedDB). I decided to store the API key using Capacitor Storage in order to save it outside of the browser storage which is a little more secure from my understanding.
The general flow is upon login or account creation, the API key gets put into my Vuex store in memory and saved to persistent storage using Capacitor Storage. All API calls use the key from the Vuex store (in memory). When the app is freshly loaded, the API key pulled from persistent storage using Capacitor Storage and re-populated into Vuex in memory.