[Nuxt.js]vue-fabを使用したフローティングボタンの作成

最近はフロントの仕事が多いので、ずっとブログでNuxtについての記事を発表しています😄
計画にフローティングボタンがあるので...
自分で作る時間がないので、ライブラリを使いました.
vue-fabライブラリ
ここを参照してダウンロードすればいいです.
でも直接実行するとこうなります
例にプラス記号ボタンがあるのに、なぜadd形式で現れるのか...

最終的にはnode_modules/vue-fab/src/FAB.vueで使用を変更する.
修正:これにより、npmを再度インストールする人がいると、既存のコードがすべて失われるので、ファイルを自分の希望するディレクトリにコピーして使用できます.
FAB.docsではvueのさざ波ショーは基本的にtrueです

ここでiをすべてspanに変更し、@click=「切り替え=!切り替え」を@click=「actions」に変更します.
vue-fabを使用すると、それぞれの使用ファイルに以下のように表示されます.

    <fab
      :position="position"
      :bg-color="bgColor"
      :actions="alert"
      :main-icon="mainIcon"
    />

 data () {
    return {
      // floating button 속성 변수
      bgColor: '#F44336',
      position: 'bottom-right',
      mainIcon: '+'
    }
  },
    
 methods () {
    alert () {
      alert('Clicked on alert icon')
    }, 
 }

私の場合、クリック時に複数のメニューが表示される必要はありません.

このように押すときは字を動かすだけでいいので、ここまで修正します.
material iconをベースにしています.
それは適用されません.addで出てきたようです.
私は+記号しか必要ないので、直接入力+使用します.