vue.js 默认选中select_VUE 单选下拉框Select中动态加载 默认选中第一个

vue select下拉框绑定默认值：

首先option要加value值，以便v-model可以获取到对应选择的值

一、当没有绑定v-model，直接给对应的option加selected属性

二、当给select绑定了v-model的值的时候，要给v-model绑定的data值里写默认值

新增学习记录

学习内容标题

学习详细内容

分类情况

{{type.name}}

添加学习内容

亲的学习内容已经发布成功

内容概览

内容描述： {{content.desc}}

内容详细描述： {{content.details}}

内容详细描述： {{content.tid}}

export default {

data() {

return {

content:{

id:"",

tid:"1",

uid:"",

datetime:"",

desc:"",

details:""

},

types:[],

submmited: false,

id:"1"

}

},

methods: {

post: function(){

this.$http.post('http://localhost:8085/content/add', this.content)

.then((data) =>{

console.log(data);

console.log(this.submmited);

this.submmited= true;

console.log(this.submmited);

});

}

},

created(){

this.$http.get('http://localhost:8085/type/showall', true)

.then(function(response){

this.types=response.data;

console.log(this.types);

})

//,this.content.id=this.types[0].id

}

}

/*

#learn-insert *{

box-sizing: border-box;

}

#learn-insert{

margin: 20px auto;

max-width: 600px;

padding: 20px;

}

*/

label{

display: block;

margin: 20px 0 10px;

}

input[type="text"],textarea,select{

display: block;

width: 100%;

padding: 8px;

}

textarea{

height: 200px;

}

#checkboxes label{

display: inline-block;

margin-top: 0;

}

#checkboxes input{

display: inline-block;

margin-right: 10px;

}

button{

display: block;

margin: 20px 0;

background: crimson;

color: #fff;

border: 0;

padding: 14px;

border-radius: 4px;

font-size: 18px;

cursor: pointer;

}

#preview{

padding: 10px 20px;

border: 1px dotted #ccc;

margin: 30px 0;

}

h3{

margin-top: 10px;

}