Bottom nav
v-bottom-nav
はサイドバーの代わりに使用することができます。主にモバイルで使用され、アイコンとテキスト、そしてシフトの2種類が用意されています。
Usage
While the bottom nav is meant to be used with the vue-router
, you can also programmatically control the active state of the buttons by using the active.sync
prop. You can change a button's value by using its value
attribute.
API
v-bottom-nav
arrow_drop_down
search
Name
absolute
Default
false
Type
boolean
Position the element absolutely
Name
active.sync
Default
undefined
Type
number | string
現在アクティブなボタンの値を保持します。特に値が設定されない場合は、index の値が代わりに使用されます。この prop は .sync 修飾子をサポートします。
Name
app
Default
false
Type
boolean
Components.BottomNavigation.
Name
color
Default
undefined
Type
string
コンポーネントに色を設定します。この色は、定義されている色の名前(例えばsuccess
やpurple
)や、CSSの色指定(#033
やrgba(255, 0, 0, 0.5)
)を設定できます。
Name
dark
Default
false
Type
boolean
ダークテーマを適用します。
Name
fixed
Default
false
Type
boolean
Position the element fixed
Name
height
Default
56
Type
number | string
Components.BottomNavigation.
Name
light
Default
false
Type
boolean
ライトテーマを適用します。
Name
mandatory
Default
false
Type
boolean
Components.BottomNavigation.
Name
shift
Default
false
Type
boolean
Components.BottomNavigation.
Name
value
Default
undefined
Type
any
Components.BottomNavigation.