Проблема с реактивностью provide/inject в vue.js

В родительском компоненте я объявил модель currencies как пустой массив и на хуке created я с помощью fetch записываю в модель некоторые данные и хочу отправить модель к далекому компоненту, но возникает проблема, так как передается изначальное значение currencies, а не обновленное на хуке. Пробовал гуглить, информации именно под мой случай нет, только для composition API. Буду благодарен за ответ. Код ниже. Документацию я читал и их вариант мне не подходит, так как в главном компоненте нет объекта Vue и js на это очень сильно ругается

import AppBtnList from "./components/AppBtnList.vue";
import AppDisplay from "./components/AppDisplay.vue";

export default {
  components: { AppDisplay, AppBtnList },
  name: "App",
  data() {
    return {
      currencies: []
    };
  },
  provide() {
    return {
      currencies: this.currencies,
    };
  },
  computed() {},
  created() {
    fetch("https://www.cbr-xml-daily.ru/latest.js")
      .then((data) => data.json())
      .then((data) => {
        try {
          this.currencies = data.rates;
        } catch (e) {
          console.error(e);
        }
      });
  },
};
</script>```