https://michaelstivala.com/setting-the-default-value-of-a-select-tag-in-vuejs/
似乎get的最初設定為空字串，依然可以接收object！例子如下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<div id="app">
{{arr1}}
<select v-model="get" @input="setSelected"> <!-- 似乎get的最初設定為空字串，依然可以接收object，例如這裡不需要加 @input="setSelected" -->
<option value="" selected>444</option> //注意這裡value不能帶字串，不然會無法顯示為default！！！
<option v-for="i in arr1" :value="i">{{i.name}}</option>
</select>
{{get}}
{{get.name}}
</div>
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
<script>
var app=new Vue({
el:'#app',
data:{
arr1:[
{
id:1,
name:'123'
},
{
id:2,
name:'456'
}
],
init:'',
get:''
},
// watch:{
// get:function(){
// setter{}
// if(this.init){
// this.init=''
// } else{
// this.init = { id:0, name:''}
// }
// }
// },
methods:{
setSelected:function(){
this.get={
id:0,
name:''
}
}
}
})
</script>
</body>
</html>
沒有留言:
張貼留言