1、组件如何开发
https://m.cnblogs.com/363429/7705052.html
2、组件如何传值
父传子
//父组件调用
<show-select selectWidth="1000" :subject="selectData" ></show-select>
data: function() {
return {
selectData:[{value:1,text:"ding"},{value:2,text:"liang"}]
}
},
//子组件 default:添加默认值
<div class="option-item" v-for = "(item,index) in subject" >{{item.text}}</div>
props:{
selectWidth:{
type:Number,
default:100,
},
subject:{
type:Array,
default:function(){
return []
}
},
selectContent:{
type:Object,
default:function(){
return {value:0,text:"请选择"}
}
},
},
子传父
//子
this.$emit("changeSelect",this.selectContent.text,this.selectContent.value);
//父
<show-select v-on:changeSelect="getUserSelect"></show-select>
methods: {
getUserSelect: function(name,value){
this.userSelect = name;
}
}
http://blog.csdn.net/yu88288356/article/details/54895033
3、实例(jump.vue select.vue)
https://github.com/DINLiang/vue-demo