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