LoginSignup
0
1

More than 3 years have passed since last update.

Vue.js表示・非表示などの条件をjs側に書くのがめんどいとき

Last updated at Posted at 2018-12-19

Vue.jsでデータを表示させるときに、条件をjs側に書くのが時間的に難しいときはこんな感じで書くと簡単で良い。
あまりいい書き方でないかもしれない(マサカリ怖い)


// v-showの条件でjs側にwatchとかメソッドとかで書くのが面倒なとき、簡易的に。
<label v-show="picked.hoge == '1'">サンプル</label>
    <input type="text">

// 名前があったときその名前、ないときデフォルトの名前
{{hoges.hoge_name ? hoge.hoge_name : 'tarou'}}

// セレクトの中でデータが存在する?もしくは特定の値のときだけbindしたいとき
<select v-model="data">
<option v-for="data in data" v-bind:value="data ? 1 : 2">
0
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
1