Как добавить Font-awesome icon в tabview в платформе Nativescript Vue

Question

Я пытаюсь использовать значок шрифта внутри элемента TabView. Я могу использовать этот же код в другом месте на странице, и он отлично работает. Это просто не будет отображать значок внутри вкладки.

В моем main.js:

import {TNSFontIcon, fonticon} from 'nativescript-fonticon';


TNSFontIcon.debug = true;
TNSFontIcon.paths = {
  'fa': './assets/css/font-awesome.css',
  'ion': './ionicons.css'
};
TNSFontIcon.loadCss();

Vue.filter('fonticon', fonticon);

В App.vue:

<TabView class="tab-view" :selectedIndex="selectedIndex" androidTabsPosition="bottom">
  <TabViewItem class="fa" :text="'fa-plane' | fonticon" >
    <Label text="Content for Tab 1"/>
  </TabViewItem>
  <TabViewItem title="Tab 2">
    <Label text="Content for Tab 2" @tap="pretextsTap()" />
  </TabViewItem>
</TabView>

Я использую платформу Nativescript Vue и не могу найти пример использования значка font-awesome внутри элемента tabview. В первом TabViewItem я пытался добавить значок fa-plane, чтобы проверить, правильно ли я понял. Это не так. Я с нетерпением жду вашего совета.

Благодарю.

Answer 1

Элементы представления вкладки имеют свойство заголовка, а не текст. Дайте:title="'fa-plane' | fonticon" выстрел.