分類: VUE

vue表示法

//文字裡面這樣用
<option>{{Item.title}}</option>

//三個值的時候 會是 物品、key、索引值 (目前這個沒用過)

v-for="(item, key, index) in list"

//兩個值的時候 會是 物品、索引值 (這好用)

 <li v-for="(item, index) in list">

 

//屬性裡面這樣用
<select :class=”Item.classs”>

屬性裡面 加上 JS

 <img :src="'../' + item.pic">

vue裡 selected預設選取作法其一

HTML

<select id=”p1″>
<option :value=`${s.id}` v-for=”(s, index) in mypost” :selected=”index == 1″>{{s.title}}</option>
</select>

JS

banner = new Vue({
el: ‘#postbig’,
data: {
mypost: []
}
});

這邊

:selected=”index == 1″

就是 如果索引值等於1 就出現selected選取狀態

vue select默認選中預設選項

HTML====

<!– VUE –>
<div id=”app-4″>
<select name=”e_location_id” id=”e_location_id” v-model=”cool”>
<option v-for=”todo in todos” :value=”todo.d_id” >
{{ todo.d_title }}
</option>
</select>
</div>

 

JS====

var app4 = new Vue({
el: ‘#app-4′,
data: {
cool:’2’, //這邊默認id值即可 預設是該id值的選項
todos:[{“d_id” : “1”,”d_title” : “顆顆”},{“d_id” : “2”,”d_title” : “呵呵”}]
},

})