Vue.js imgタグのsrc属性にデータバインディングのやり方
vue.jsで属性に対してデータバインディングを行うためのやり方を記述してます。v-bindを使うと実現可能です。
環境
- OS CentOS 8.0.1905 (Core)
- node v12.13.1
- npm 6.13.2
- @vue/cli 4.1.1
マスタッシュ構文
通常だとマスタッシュ構文を利用すればデータバインディング は行えますが、属性に対して、そのまま実行するとエラーになります。
## エラーとなる
<img src="{{ src }}">v-bindを使う
v-bindを利用すれば、属性へのデータバインディングは可能になります。
<img v-bind:src="src">省略も可能です。
<img :src="src">-
前の記事
Nuxt.js ライブラリ「vue-fake-input」をインストールして文字列を分割して1文字ずつ入力する 2020.06.23
-
次の記事
CentOs8 最新版のChef Workstationをインストールする手順 2020.06.24